Javascript 使用嵌入或对象标记中的元素

我在页面中插入了带有嵌入或对象标记的svg图形：

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

---

是否可以像往常一样浏览图形元素？

它将显示为一个单独的文档，类似于iframe。您可以这样访问它：

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

<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>

请注意，等待svg文件加载是很重要的；您可能希望将代码放入

对象

元素的

onload

事件处理程序中，如下所示：

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

<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>

document.getElementById（'graphics'）。addEventListener（'load'，function（）{
var svg=document.getElementById（'graphics'）.contentDocument
//做一些事情，调用函数等。
})

我不知道jQuery本身是否可以实现这一点，但快速的谷歌搜索产生了这个插件，它可能会实现这个目的：谢谢！当我试图搜索答案时，我看到了这个片段。现在我看到它确实工作了，但我无法检查是否加载了SVG对象。我是否必须输入类似于

$（'#graphics'）.load（function（）{/*…*/}

？是的，应该可以。我用一个简单的javascript示例进行编辑，但这对jQuery.Hmm应该有效。

$（'#graphics'）[0]。addEventListener（'load'，function（）{}）

可以工作，但是

$（'#graphics'）.load（function（）{}）

没有…我在谷歌搜索解决方案时看到了您的最后一段代码，但我没有完全尝试-这就是我犯错误的地方。是否可以使用此方法将svg中的元素（组、路径）作为目标？