使用的是 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. HDOJ(1003) Max Sum

    写的第一个版本,使用穷举(暴力)的方法,时间复杂度是O(N^2),执行时间超过限制,代码如下: #include <stdio.h> #define MAX_LEN 100000UL in ...

  2. Django路由

    一.路由流程 1. 用户浏览器发出请求后,通过根url设置,去找urlpattern变量.在setting.py中对 ROOT_URLCONF进行配置,以确定根URLconf(URL configur ...

  3. E8.NET工作流平台如何与其他软件系统集成?

    1.与邮件系统集成 E8.Net工作流开发架构已经提供了与电子邮件系统集成的模块,可以轻松实现与EXCHANGE等专业邮件系统集成的应用需求. 2.与短信系统集成 E8.Net工作流架构已经提供了手机 ...

  4. Linux命令总结(转载)

    转子:http://www.cnblogs.com/CGDeveloper/archive/2011/05/27/2060009.html 昨天看了一个教程,关于Linux命令的,本来以为当是复习随便 ...

  5. vue-cli + webpack

    vue-cli + webpack 关于vue.js vue.js是一套构建用户界面的 轻型的渐进式前端框架.它的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.使用vue可以给你 ...

  6. Python按照索引访问list

    由于list是一个有序集合,所以,我们可以用一个list按分数从高到低表示出班里的3个同学: >>> L = ['Adam', 'Lisa', 'Bart'] 那我们如何从list中 ...

  7. C# - implicit, explicit

    如果类型直接没有继承关系,也没有共享接口,想在这两个类型之间进行转换,就必须重载转换运算符. 此时需要关键字implicit和explicit. 下面定义了类型ConvClass1和ConvClass ...

  8. <二> ASP.NET AutoPostBack

    当把Web控件的AutoPostBack属性设置为True时,自动回送功能被开启,ASP.NET使用客户端的 JavaScript来连接客户端和服务器端的代码.创建一个Web控件属性包含AutoPos ...

  9. python eval函数

    eval()函数十分强大,官方demo解释为:将字符串str当成有效的表达式来求值并返回计算结果. 可以把字符串转为list.tuple .dict  等数据类型 1.把字符串转为字典 ####### ...

  10. ACM-进阶之路

    ACM进阶计划 ACM队不是为了一场比赛而存在的,为的是队员的整体提高. 大学期间,ACM队队员必须要学好的课程有: l C/C++两种语言 l 高等数学 l 线性代数 l 数据结构 l 离散数学 l ...