javascript - 如何在现有 svg 对象上创建 JQuery 包装器?

标签 javascript jquery html svg

在类似的主题中,我问过这是否可能(http://stackoverflow.com/questions/6006364/svg-through-the-jquery-svg),但是当我尝试实现时:

<body onload="alert('loaded');testSvg();">
<div id="div3" style="border: solid 1px black; width:200px; height:100px">
    <svg id="svg3" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"></svg>
</div>

<script type="text/javascript">
function testSvg() {
    var svgRootElement = $("#svg3").get();
    var svgWrapper = new $.svg._wrapperClass(svgRootElement);
    svgWrapper.circle(30, 25, 50, { fill: 'red' });
}

我遇到一个错误:

'TypeError: Unable to get value of the property 'createElementNS': object is null or undefined' error...

为什么?如何解决这个问题?

谢谢!

最佳答案

您想要获取第一个 DOM 元素,而不是数组。使用数组访问器或 .get(0):

var svgRootElement = $("#svg3")[0];
console.log(svgRootElement);
var svgWrapper = new $.svg._wrapperClass(svgRootElement);
svgWrapper.circle(30, 25, 50, { fill: 'red' });

此处的工作示例:http://jsfiddle.net/nrabinowitz/kJCAr/

关于javascript - 如何在现有 svg 对象上创建 JQuery 包装器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6033939/

相关文章:

javascript - 来自数据库的 base.html 中的 Django init 东西

javascript - 通过函数查询firebase实时数据库

javascript - 在输入范围的光标上显示价格

JavaScript:替代 JQuery 的(双)Slider 控件?

javascript - 非常简单的 toggleClass 不起作用

html - 仅在 IE7、Chrome 和 FF 上存在的简单 CSS 居中问题很好

javascript - Google Analytics 页面内分析是如何工作的?

javascript - 使用 Javascript 数到 100(在 div 中)

jquery - 使用 :before :after with Font Awesome Icons 切换按钮

javascript - 绕过键盘重复的方法?