6

埋め込みタグまたはオブジェクト タグを使用してページに挿入された svg グラフィックがあります。

<object data="graphics.svg" type="image/svg+xml" id="graphics" />

画像は正しく読み込まれており、ブラウザー デバッガーで SVG 構造を確認できます。すべての要素の ID と属性が表示されますが、ページ上のスクリプトでこれらの要素を選択する方法がないように思えます。

$('#graphics path').length; // 0 (jQuery)
$('path').length; // 0 anyway

いつものようにグラフィック要素をブラウズすることはできますか?

4

1 に答える 1

10

iframe と同様に、別のドキュメントとして表示されます。次のようにアクセスできます。

var svg = document.getElementById('graphics').contentDocument

svg ファイルがロードされるまで待つことが重要であることに注意してください。object次のように、要素のonloadイベント ハンドラーにコードを配置することができます。

<object data="graphics.svg" type="image/svg+xml" id="graphics" />
<script>
  document.getElementById('graphics').addEventListener('load',function(){
    var svg = document.getElementById('graphics').contentDocument
    // do stuff, call functions, etc.
  })
</script>
于 2013-01-17T10:29:38.423 に答える