¿Cómo modificaría una etiqueta de imagen dentro de un SVG usando Javascript?
Así que tengo una imagen almacenada en un SVG, así:
<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>Entonces, la sugerencia que obtuve en línea y probé en mi secuencia de comandos fue obtener la identificación y actualizar la fuente de esta manera:
document.getElementById("changingImage").src = "phone2.png";Eso no funcionó, así que lo pensé un poco y me di cuenta de que las etiquetas de imagen en SVG no usan SRC, usan HREF. Así que probé lo siguiente, pero todavía no funcionó:
document.getElementById("changingImage").href = "phone2.png";¿Alguien sabe cómo modificar imágenes dentro de un SVG usando javascript, o tiene alguna idea sobre lo que podría intentar?
Me gustaría publicar la respuesta con la sintaxis para cualquiera que pueda tener el mismo problema. La sugerencia del usuario @enxaneta funcionó, usando setAttribute . Esta es la sintaxis basada en el ejemplo anterior.
document.getElementById("changingImage").setAttribute("href", "phone2.png");