如何通过JavaScript更改SVG内的图案图像参数？

我必须改变嵌入SVG，在模式定义并应用到矩形/路径容器标识图像链接内的标志。有没有办法来改变链接到的图像（的XLink：HREF =“link_to_logo.svg”）由JS？如何通过JavaScript更改SVG内的图案图像参数？

<pattern id="logo" 
    patternUnits="objectBoundingBox" 
    x="0" y="0" width="1" height="1"> 
    <image x="0" y="0" 
     xlink:href="link_to_logo.svg" 
     width="331" height="331"> 
    </image> 
</pattern> 

<path id="logo-container" d="M1152 99h331v331h-331z" fill="url(#logo)"/>

来源

2016-11-27 Sergey Prostov

$('#logo img').attr('xlink:href', 'newValue')

应该这样做。

来源

2016-11-27 18:39:57

谢谢你的回答，现在将尝试... –

你能解释一下'img'，而不是'image'的使用情况如何？当选中时，浏览器将DOM从图像更改为img，但我没有发现任何可信的来源。 – Dekel

@Dekel遗憾，是一个错字 –

image.setAttributeNS("http://www.w3.org/1999/xlink","href",newValue)

in plain js use setAttributeNS。

来源

2016-11-27 18:49:45

谢谢Holger，也会尝试你的方法 –

如何通过JavaScript更改SVG内的图案图像参数？

回答

相关问题