how to change svg text tag using javascript innerHTML
61,604
Solution 1
SVG nodes don't have a innerHTML property (they're not HTML).
Use textContent instead: t.node.textContent='dddd'
Solution 2
I was able to accomplish this by setting the textContent property of the <text>
element. Makes it a lot easier if you know the ID of the element.
document.getElementById("id-of-text-el").textContent = "My Value";
Solution 3
if the code for the svg text is like this:
<text id="id-of-the-text"> old value</text>
if you are using JQuery try this:
$("#id-of-the-text").text("new-value");
Author by
zjm1126
Every morning when I opened my eyes ,the responsibility of deliver the earth falls on my shoulders.
Updated on February 12, 2020Comments
-
zjm1126 over 4 years
i was using raphaeljs , and i want to show html(not only text) in svg,
so i use this code :
var r = Raphael("holder", 200, 300); var t = r.text(10, 10, "ssdwqdwq"); t.node.innerHTML='dddd'
but i cant change the svg's content , so i console it in firebug ,
console.log(t.node)
it show this :
<text x="10" y="13.5" text-anchor="middle" style="font: 10px "Arial";" font="10px "Arial"" stroke="none" fill="#000000">
so how to change the text using javscript on svg
thanks