He importado un SVG usando y estoy tratando de acceder al <tspan> , porque necesito cambiarlo, pero cuando agrego un id="test" al tspan usando document.getElementById('test'); no da resultado alguno...
¿Como puedó resolver esté problema?
Soy consciente de que puedo cambiar el texto interno usando element.innerText , pero mi resultado es nulo...
Mi SVG:
<text transform="translate(42.88 166.17)" style="font-size: 12px;font-family: SegoeUI, Segoe UI">Test test<tspan x="135.69" y="0" style="letter-spacing: -0.0634765625em">T</tspan><tspan x="141.38" y="0">esting</tspan><tspan x="0" y="18">Just a test</tspan><tspan x="0" y="36">test</tspan><tspan id="test" x="0" y="72">Change me via JavaScript</tspan></text>Mi HTML:
<div class="sidebar"> <object id="sidebartoggle" data="/graphics/test.svg" type="image/svg+xml" onclick="toggleSidebar();" style="top:50%;right:1%;position:fixed;display:flex;justify-content:flex-end;width:500px;transform: translateX(99%); z-index:9999999;" > </object> </div>Estoy ejecutando el JS en la consola del navegador hasta ahora.
Solo tienes un error tipográfico.
document.getElementByID('test');necesita ser
document.getElementById('test');entonces debería funcionar bien.