使用的是 createElement 方法 这个是无法生成SVG DOM的

可以使用下方的方法生成

  1. var svgns = "http://www.w3.org/2000/svg";
  2. $.svg = function $svg(tagName) {
  3. return $(document.createElementNS(svgns, tagName));
  4. };

判断一个dom元素是否是svg dom的方法

  1. function isSVG(el) {
  2. return el && el.nodeType === 1 && (el instanceof window.SVGElement)
  3. }

上次采用SVG来做按钮来适应动态改变颜色需求,但是需要用JS自动隐藏和显示。发现用jQuery的addClass("hide")方式无法写进去。我猜测是因为SVG不属于HTML常规DOM元素才会无效果,之后我在SVG上包了一个DIV后解决了这个问题。

其实还有一种可以用原生JS去添加class如下。

document.getElementById("svg").setAttribute("class","hide");

jquery 创建 SVG DOM 的处理方法的更多相关文章

  1. jQuery编程基础精华01(jQuery简介,顶级对象$,jQuery对象、Dom对象,链式编程,选择器)

    jQuery简介 什么是jQuery? jQuery就是一个JavaScript函数库,没什么特别的.(开源)联想SQLHelper类 jQuery能做什么?jQuery是做什么的? jQuery本身 ...

  2. 了解jQuery并掌握jQuery对象和DOM对象的区别

    jQuery的优势: 开源--开放源代码 轻量级 强大的选择器 出色的DOM操作(对DOM元素的一个增删改查) 完善的Ajax,出色的浏览器兼容性,丰富的插件支持,完善的文档(说明书) 链式操作方式, ...

  3. jQuery创建DOM的方法

    jQuery1.4带来了一个全新的便捷地清晰的DOM对象创建方法,在 jQuery 1.4中,我们可以传递一个对象作为第二个参数. 这个参数接受一个属性的集合,这些可以传递给.attr() 方法.此外 ...

  4. SVG DOM常用属性和方法介绍

    将以Adobe SVG Viewer提供的属性和方法为准,因为不同解析器对JavaScript以及相关的属性和方法支持的程度不同,有些方法和属性是某个解析器所特有的.SVG支持DOM2标准. 12.2 ...

  5. jQuery基础之(四)jQuery创建DOM元素

    利用DOM方法创建元素节点,通常要将document.createElement().document.createTextNode().appendChild()配合使用,十分麻烦. 而jQuery ...

  6. jQuery基础(DOM篇,append(),after(),prepend(),insertAfter(),节点删除,遍历方法each())

    1.DOM创建节点及节点属性   创建流程比较简单,大体如下:   - 创建节点(常见的:元素.属性和文本) - 添加节点的一些属性 - 加入到文档中   流程中涉及的一点方法:   - 创建元素:d ...

  7. SVG DOM常用属性和方法介绍(1)

    12.2  SVG DOM常用属性和方法介绍 将以Adobe SVG Viewer提供的属性和方法为准,因为不同解析器对JavaScript以及相关的属性和方法支持的程度不同,有些方法和属性是某个解析 ...

  8. js和jQuery创建元素和把元素插入到文档中所用的方法

    js创建元素: document.createElement(" 创建的元素");   //“创建的元素”指:p ,h1,div,span........ js插入元素: docu ...

  9. jquery对象与dom对象之间互相转换的方法

    本文主要讲述jquery对象和js里的dom对象之间互相转换的方法,使jquery对象可以直接使用js里的方法,或js里的dom对象使用jquery里的方法. jquery对象和dom对象是不一样的, ...

随机推荐

  1. 实习笔记-2:sql 分组不一定要group by

    今天在公司写代码的时候,遇到一个sql语句构建问题. 情形是这样的: 我需要获取不同小组下前N条记录. select top 10 * from dbo.Topic where GroupID in ...

  2. PHP 各种函数

    usleep() 函数延迟代码执行若干微秒. unpack() 函数从二进制字符串对数据进行解包. uniqid() 函数基于以微秒计的当前时间,生成一个唯一的 ID. time_sleep_unti ...

  3. WebBench简介

    /** @brief     Web Bench Description* @author  Tang Huaming* @qq        1426213638* @E-mail   xiaoma ...

  4. xml simpleXML_load_file(), simpleXML_load_string()

    xml.xml文件 <?xml version='1.0'?><man>    <att>        <name>lin3615</name& ...

  5. NHibernate多对多关联映射的实现

    上次用EF演示了数据库多对多关系的操作,这次我们还是引用上次的案例,来演示如何在C#当中使用NHibernate. 首先介绍一下NHibernate框架的来源.熟悉Java编程的读者肯定知道Hiber ...

  6. Transaction的理解

    Transaction的理解   待完善......

  7. php开学之环境搭建

    1. php版本选择 1.1 PHP非线程安全与线程安全版本的选择技巧 1.2 版本区别 PHP的大版本主要分三支:PHP4/PHP5/PHP6 其中,PHP4由于太古老.对QQ支持不力已基本被淘汰, ...

  8. can't add foreign key in mysql?

    create table department (dept_name ), building ), budget numeric(,) ), primary key (dept_name) ); cr ...

  9. shell中的重定向(2>&1)

    shell的输出可以分为标准输出和错误输出,2>&1中,2代表错误输出,1代表标准输出,&符号代表后面跟的是代号而不是文件. test.sh echo '我是标准输出' ls / ...

  10. Java学习-Overload和Override的区别

    1.Overload是重载的意思,Override是覆盖的意思,也就是重写. 2.重载Overload表示同一个类中可以有多个名称相同的方法,但这些方法的参数列表各不相同(即参数个数或类型不同). 3 ...