如何使用 Javascript 修改 SVG 标签中的图像标签？答案

【问题标题】：How to Amend an image tag in an SVG tag using Javascript?如何使用 Javascript 修改 SVG 标签中的图像标签？
【发布时间】：2021-12-07 23:03:59
【问题描述】：

您将如何使用 Javascript 修改 SVG 中的图像标签？

所以我有一个存储在 SVG 中的图像，如下所示：

<svg height="666px" width="666px" viewBox="0 0 600 600">
 <image id="changingImage" href="phone.png" x="69.0802" y="344.9714" height="28" width="28"></image>
</svg>

所以我从网上得到并在我的脚本中尝试的建议是获取 ID 并更新源，如下所示：

document.getElementById("changingImage").src = "phone2.png";

那行不通，所以我想了想，意识到 SVG 中的图像标签不使用 SRC，它们使用 HREF。所以我尝试了以下方法，但还是不行：

document.getElementById("changingImage").href = "phone2.png";

任何人都知道如何使用 javascript 修改 SVG 中的图像，或者对我可以尝试什么有任何想法？

【问题讨论】：

您可能需要使用setAttribute
谢谢你的建议，我会查查的！
它成功了！

标签： javascript html svg

【解决方案1】：

我想为可能遇到相同问题的任何人发布带有语法的答案。来自用户 @enxaneta 的建议有效，使用 setAttribute。这是基于上面示例的语法。

document.getElementById("changingImage").setAttribute("href", "phone2.png");

【讨论】：