为什么 jQuery 不能可靠地向 SVG 元素添加类？

jQuery SVG：类修改的限制

尝试使用 jQuery 操作 SVG 元素上的类时，您可能会遇到困难。让我们探讨一下这个问题。

在您提供的代码中，您尝试使用 .addClass() 将“单击”类添加到 SVG 矩形。但是，由于 jQuery 的潜在限制，此方法可能无法正常工作。

3 之前的 JQuery 版本在与 SVG 元素交互时存在已知问题。具体来说，他们无法可靠地从 SVG 元素中添加或删除类。这是因为 jQuery 主要操作底层 HTML DOM，而 SVG 元素具有不同的内部表示。

解决方法：

要克服此限制，您可以采用以下方法解决方法：

• 升级到 jQuery 3： 版本jQuery 的第 3 章解决了 SVG 类操作的问题。如果可能，请更新到此版本以解决问题。
• 使用 Vanilla JavaScript： 在现代浏览器中，您可以直接访问元素的 classList 属性并对其进行修改。例如：

const element = document.getElementById("p5");
element.classList.add("clicked");

• 使用 jQuery 的 .attr(): 可以使用 .attr() 来操作类属性。但是，请记住，这会更改整个类列表，而不仅仅是添加或删除单个类。

$("#p5").attr("class", "jimmy clicked");

通过实施这些解决方法，您应该能够有效地从 SVG 元素添加和删除类使用 jQuery 或普通 JavaScript。

以上是为什么 jQuery 不能可靠地向 SVG 元素添加类？的详细内容。更多信息请关注PHP中文网其他相关文章！