使用的是 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. 第30条:用enum代替int常量

    在java1.5之前,表示枚举类型的常用模式是声明一组具名的int常量,每个类型成员一个常量: public static final int APPLE_FUJI = 0; public stati ...

  2. Mac 系统下安装 MySql

    Mac原生没有带MySql,想要使用需要自己去安装. 下载. 首先去mysql官网下载安装包. 由于现在mysql对企业有服务,所以有所谓社区版(community)和企业版(enterprise), ...

  3. Web前端新人笔记之jquery入门

    本章将为大家介绍以下几点内容: 1.jquery的主要特点: 2.建立jquery的编码环境: 3.简单jquery脚本示例: 4.选择jquery而不是纯javaScript的理由: 5.常用的jq ...

  4. 网页制作常见的面试题(怎样兼容IE6/IE7/火狐浏览器)

    1.IE6双边距问题? 在IE6的浏览器中明明设置的是10px的margin却为什么显示的是20px的margin其实这个Ie6的一个双边距BUG例如:<style type="tex ...

  5. python 数据类型(列表)学习笔记

    列表 创建列表: name_list = ['alex', 'seven', 'eric'] 或 name_list = list(['alex', 'seven', 'eric']) 其实今天学习的 ...

  6. leetcode 解题 String to Integer (atoi)(C&python)

    //此题是easy题,比较简单,主要困难在考虑全输入的各种情况://1.开始的时候有空格等空白字符//2.开头有加减号//3.溢出(第一次写就是没有考虑到这个情况) //C代码int myAtoi(c ...

  7. 【prism】前期准备

    在网上下了prism框架源码,目前最新版本为4.1,其中包含的内容如下: 其中包含三类文件: 1.类似于Desktop only-Prism Library.bat的批处理文件,用来打开相应的Pris ...

  8. 导航栏 & 状态栏覆盖

    当 automaticallyAdjustsScrollViewInsets 为 YES 时,也是默认行为,表现就比较正常了,和 edgesForExtendedLayout = UIRectEdge ...

  9. 在asp.net中如何自己编写highcharts图表导出到自己的服务器上来

    1.准备工作:网上下载highcharts导出的关键dll.      1).Svg.dll:因为highcharts的格式其实就是一个xml,采用svg的方式画图:      2).itextsha ...

  10. Portal技术综述

    从上世纪八十年代起,随着个人计算机(PC)的发展,企事业单位逐步建立起计算机应用系统来处理传统事务.从简单的单机应用逐步发展到局域网系统,进而建立跨地区垮国家的广域网系统.从单纯的以科学计算和数据管理 ...