web-dev-qa-db-ja.com

javascript innerHTMLを使用してSVGテキストタグを変更する方法

raphaeljsを使用していて、svgにhtml（テキストだけでなく）を表示したいのですが、

だから私はこのコードを使用します：

var r = Raphael("holder", 200, 300);
var t = r.text(10, 10, "ssdwqdwq");
t.node.innerHTML='dddd'

しかし、SVGのコンテンツを変更できないので、Firebugでコンソールします。

console.log(t.node)

それはこれを示しています：

<text x="10" y="13.5" text-anchor="middle" style="font: 10px "Arial";" font="10px "Arial"" stroke="none" fill="#000000">

だからSVGでjavscriptを使用してテキストを変更する方法

ありがとう

javascriptsvgraphael
25
zjm1126

SVGノードにはinnerHTMLプロパティがありません（それらはHTMLではありません）。

代わりにtextContentを使用してください：t.node.textContent='dddd'

67
Zecc

svgテキストのコードが次のようである場合：

<text id="id-of-the-text"> old value</text>

jQueryを使用している場合は、次のことを試してください。

$("#id-of-the-text").text("new-value");
4
Emre Basala

<text>要素のtextContentプロパティを設定することで、これを実現できました。要素のIDを知っていれば、はるかに簡単になります。

document.getElementById("id-of-text-el").textContent = "My Value";
2
contactmatt