javascript - 更改 svg 元素中的图像

Question

我正在尝试修改 HTML 文档中的现有 SVG 元素。我有以下内容:

<svg class="logo" viewBox="0 0 435 67"> <!-- IMAGE DIMENSIONS -->    
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#logo--someLogo"></use>
</svg>

我想它必须在 xlink:href="#logo--someLogo" 中，但是当我尝试使用 .svg 文件或 .png 之类的浏览器更改它时

$('.logo use').attr('xlink:href', "//someurl.com.png");

它没有显示任何内容。

所以我想知道如何使用另一个源更改该 xlink:href 。

Answer 1

也许有针对这些类型的文档节点的 native 方法，但这也可以工作(如果只有一个 use 标签)。

document.getElementsByTagName('use')[0].setAttribute('xlink:href', 'link_to_another_image')