如何在 HTML 中访问"embed"标记的内容

Question

我有一个SVG文件，我不想将它粘贴到HTML文件中，因为这会变得很混乱。因此，在咨询了w3schools之后，"嵌入"标签似乎是将外部SVG文件包含到HTML中最安全的方法。

<embed src="path_to_svg" type="image/svg+xml" id='svgsource' />

但是，我需要在主html文件中通过javascript通过DOM访问svg元素。不幸的是没有

document.getElementById('my_svg_id')

和

document.getElementById('svgsource').contentDocument

可以在任何浏览器中工作。使用"object"标签也不能达到目的。

Answer 1

使用.getSVGDocument()。这似乎适用于<embed>, <object>和<iframe>:

document.getElementById('svgsource').getSVGDocument()

对于<object>或<iframe>，您也可以使用.contentDocument:

document.getElementById('svgsource').contentDocument

对于IE7或IE8，我相信你运气不好。

Answer 2

完成约转!

事实证明你可以，请看这个链接:http://xn--dahlstrm-t4a.net/svg/html/get-embedded-svg-document-script.html

(另外，去投票Erik Dahlström的其他答案，给他一些分数，因为我劫持了他的答案!)

Answer 3

简短的回答:您可以尝试内联所引用的SVG文件内容。对于<object>和<iframe>元素，使用:

e.parentElement.replaceChild(e.contentDocument.documentElement.cloneNode(true), e);

…其中e是引用元素。如果绝对需要<embed>元素，那么将上面代码中的.contentDocument更改为.getSVGDocument()(括号是必需的)。但是请注意，.getSVGDocument()现在已被弃用，因此不推荐使用，但也已经建议使用<object>或<iframe>来代替<embed>。

要获得更完整的答案，请参阅我关于该主题的其他SO答案。

Answer 4

你试过使用

Answer 5

我相信在IE9中，您可以使用<iframe>元素来加载SVG，在这种情况下，您可以访问contentDocument属性，但在以前的IE版本中，您可能不太幸运。(其他浏览器应该允许您将contentDocument与<embed>和<object>一起使用。)