Tot*_*Tot 9 javascript jquery svg snap.svg
Snap.svg在这种情况下不起作用:
$('body').append($('<svg>').attr('id', 'test')) ;
console.log($('#test').length) ; // 1
var svg = Snap('#test') ;
svg.circle(100, 100, 50) ;
// Uncaught TypeError: Object [object Object] has no method 'circle'
...但是当元素已经在HTML中时有效:
<body>
<svg id="test"></svg>
</body>
SVG元素在HTML中成功,但在Snap.svg中找不到.我第一个例子做错了还是错误？
看起来你找到了一个解决方法,但我认为你或任何读过这个问题的人都想要一个解释.
要创建SVG元素,必须使用,document.createElementNS()因为svg元素是不同于html元素的命名空间的一部分.例如:
var elementHTML = document.createElement("svg"); //does not work
var elementSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg"); //works!
在内部,document.createElement()当你给它一个标签名称时,jquery会使用它.获得元素后,可以将其包装为jquery对象,并正常使用它.
$(elementSVG).attr("width", 100); //etc.
使用$("<svg data-blah='asdf'>")或类似的工作,因为超出简单标记的任何东西都被放入元素中.innerHTML然后被提取出来.通过这种方式,使用相同的引擎就好像它在页面的HTML标记中一样.HTML5规范现在有一些特殊情况,可以在遇到<svg>标记中的元素时做些什么.
在jquery中使用svg时需要注意的一些事项是:
$element.attr("attributeName", "stroke")不起作用..animate() 有一些问题,但您可以使用自定义步骤功能来解决它.关于它的更多细节在这里
| 归档时间： |
|
| 查看次数： |
3722 次 |
| 最近记录： |