使用JavaScript选择SVG和路径元素

Question

我想选择SVG中的最后一个路径并将其删除。我已经尝试了各种方法，在纯javascript和jquery中，我似乎无法正确访问SVG或其路径。

HTML：

<div id="thesvgwrapper">    
  <svg id="thesvg"...><path ....></path><path ...></svg>
</div>

我可以使用以下方法清除SVG：

$('svg#thesvg').empty();

我可以使用以下方式查看SVG的内容：

var svgwrapper = $('#svgwrapper');
var svgcontents = $(svgwrapper).html();
alert(svgcontents);

但是，我不能同样选择SVG并查看它的路径内容......

我的目标是

$('#thesvg path:last').remove();

感谢一百万人的帮助

Answer 1

这是纯JavaScript中的可执行代码：

var paths = svgDoc.getElementsByTagName("path");
var last_path = paths[paths.length - 1];
last_path.parentNode.removeChild(last_path);

Answer 2

我假设您正在使用兼容SVG的浏览器，例如Firefox。

我尝试通过jQuery操作SVG已经有一段时间了。我记得我不愿意使用SVG jQuery插件，但没有一个我在访问DOM中的元素时遇到了一些问题。包含jQuery SVG插件允许我访问元素，因此包含它可能有助于解决您遇到的问题。