svg !!ロード時にテキストを変更する

ロード時にsvgテキストを変更する方法はありますか？標準的なSVGの例は正常に動作します。svg !!ロード時にテキストを変更する

$(document).ready(function(){ 
    document.getElementById('mySVGText').textContent = 'new_value'; 
});

それは、このSVG

<svg version="1.1" 
baseProfile="full" 
xmlns="http://www.w3.org/2000/svg" id="mySVG"> 

<rect width="100%" height="100%" fill="red" /> 

<circle cx="150" cy="100" r="80" fill="green" /> 

<text id="mySVGText" name="textName" x="150" y="125" font-size="60" text-anchor="middle" fill="white">SVG</text> 
</svg>

に動作しますが、このSVGはgetElementByIdをに私を許可し、テキストを変更doesntのように思える：

<svg version="1.1" 
id="Capa_1" 
xmlns="http://www.w3.org/2000/svg" 
x="0px" y="0px" 
viewBox="0 0 489 489" 
style="enable-background:new 0 0 489 489;" 
xml:space="preserve" 
> 

<text id="mySVGText" name="textName" x="160" y="400" font-size="280" text-anchor="middle" fill="blue">SVG</text> 

<g> 
<path style="fill:white" d="M440.1,422.7l-28-315.3c-0.6-7-6.5-12.3-13.4-12.3h-57.6C340.3,42.5,297.3,0,244.5,0s-95.8,42.5-96.6,95.1H90.3 
    c-7,0-12.8,5.3-13.4,12.3l-28,315.3c0,0.4-0.1,0.8-0.1,1.2c0,35.9,32.9,65.1,73.4,65.1h244.6c40.5,0,73.4-29.2,73.4-65.1 
    C440.2,423.5,440.2,423.1,440.1,422.7z M244.5,27c37.9,0,68.8,30.4,69.6,68.1H174.9C175.7,57.4,206.6,27,244.5,27z M366.8,462 
    H122.2c-25.4,0-46-16.8-46.4-37.5l26.8-302.3h45.2v41c0,7.5,6,13.5,13.5,13.5s13.5-6,13.5-13.5v-41h139.3v41 
    c0,7.5,6,13.5,13.5,13.5s13.5-6,13.5-13.5v-41h45.2l26.9,302.3C412.8,445.2,392.1,462,366.8,462z"/> 

</g> 

</svg>

任意の助けをいただければ幸いです。

出典

2016-06-27 A H Bensiali

どちらも私のために働いているようです。同じページにID「mySVGText」を持つ別の要素がないのは確かですか？それはあなたが見ている行動を引き起こすかもしれません。 –

うん！ Willaimに感謝します。右のお金に:) –

これは未回答として表示されないように：

問題は、ページ上のID mySVGTextを持つ2つの要素があったということでした。 document.getElementByIdは、ページの各IDが一意であると想定しているため、そうでない場合に予期しない動作をすることがあります。

出典

2016-06-27 14:46:41

svg !!ロード時にテキストを変更する

答えて

関連する問題