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

Question

我正在使用SVG来显示一些动画。 但是我是SVG的新手，我只是使用久经考验的jQuery动画为SVG元素（例如rect和circle等）设置动画。

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

我试过addClass（）和removeClass（）的普通jquery方法。 由于HTML和SVG的DOM结构不同，因此无法使用。

因此，我正在使用http://keith-wood.name/svgRef.html插件来进行SVG元素访问和动画处理。

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

感谢帮助Thnx

Answer 1

要使用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');