jQuery SVG，为什么我不能添加类？

Question

我正在使用jQuery SVG。我无法向对象添加或删除类。有人知道我的错误吗？

SVG：

<rect class="jimmy" id="p5" x="200" y="200" width="100" height="100" />

不会添加该类的jQuery：

$(".jimmy").click(function() {
    $(this).addClass("clicked");
});

我知道SVG和jQuery可以很好地协作，因为我 可以 定位对象并在单击对象时发出警报：

$(".jimmy").click(function() {
    alert('Handler for .click() called.');
});

Answer 1

阅读以下两个答案。

• jQuery 3修复了潜在的问题
• Vanilla JS：element.classList.add('newclass')可在现代浏览器中使用

jQuery（小于3）无法将类添加到SVG。

.attr() 与SVG一起使用，因此，如果您想依赖jQuery：

// Instead of .addClass("newclass")
$("#item").attr("class", "oldclass newclass");
// Instead of .removeClass("newclass")
$("#item").attr("class", "oldclass");

而且，如果您不想依赖jQuery：

var element = document.getElementById("item");
// Instead of .addClass("newclass")
element.setAttribute("class", "oldclass newclass");
// Instead of .removeClass("newclass")
element.setAttribute("class", "oldclass");