如何使用 jQuery 更改 SVG 元素属性

How to change SVG elements attributes using jQuery?

本文关键字:元素 属性 SVG 更改 何使用 jQuery      更新时间:2023-09-26

我正在使用SVG来显示一些动画。但是作为 SVG 的新手,我正在简单地使用经过试验和测试的 jQuery 动画来动画 SVG 元素,例如矩形和圆形等。

现在这不是jQuery Selector + SVG不兼容的副本吗?我想更改 a 的类 <rect class="my-class-1 box" ...></rect><rect class="my-class-2 box" ....></rect>

我已经尝试了addClass()和removeClass()的普通jquery方法。由于它们在HTML和SVG的DOM结构上的差异,这是行不通的。

所以我正在使用 http://keith-wood.name/svgRef.html 插件来执行 SVG 元素访问和动画。

卡在岩石和坚硬的地方之间

感谢帮助谢谢

要使用 jQuery svg 插件完成此操作,请为 rect 提供一些自定义 ID 属性,并将其用作选择器。 确保你也包括jquery.svgdom.js。

svgCanvas.polygon(group, getPoints(), { customID:'123', stroke: 'orange', strokeWidth: 2, class: 'my-class-1' });

现在要更改类,请使用以下选择器:

var selector = 'svg polygon[customID="123"]';
$(selector).removeClass('my-class-1').addClass('my-class-2');