Javascript 如何在DOM中获取嵌入式svg的父元素？

在DOM中，可以使用

getSVGDocument（）

向下遍历到嵌入式SVG元素中。例如，对于这样的HTML文档：

<div id="container">
    <embed id="svg-wrap" src="pic.svg"></embed>
</div>

var svg_wrap = window.frameElement;
var svg = svg_wrap.contentDocument;

---

我该如何逆转这一点，从SVG元素到封闭的embed和div元素？至少在Chrome43.0.2357.81中，普通的DOM遍历方法在SVG/HTML边界上不起作用。对于上下文，我需要这样做，以便可以计算SVG元素在页面上的位置。

以下内容如何？向它传递一个SVGDocument，它将在包含它的页面上返回嵌入

从那里，您可以使用

embeddelem.parentNode

获取DIV

function getEmbedFromSVG(svg)
{
  var allEmbeds = document.getElementsByTagName("embed");
  for (var i=0; i < allEmbeds.length; i++) {
    if (svg === allEmbeds[i].getSVGDocument())
      return allEmbeds[i];
  }
  return null;
}

函数getEmbedFromSVG（svg） { var allEmbeds=document.getElementsByTagName（“嵌入”）； for（var i=0；i从SVG内部使用类似于

文档的东西。getElementById（）

在访问“主”文档结构（放置“SVG包裹”嵌入元素的HTML）中的节点时不起作用，因为嵌入的SVG文档内容类似于“隔离”因此，您只能直接访问SVG结构本身中的节点元素。如果SVG与“主”HTML文档具有相同或不同的来源（例如，不同的域），则这始终是正确的

也就是说，幸运的是，如果HTML文档和嵌入式SVG共享同一来源，并且它使用的是

window.frameElement

，例如，有一种方法可以满足您的需要：

<div id="container">
    <embed id="svg-wrap" src="pic.svg"></embed>
</div>

var svg_wrap = window.frameElement;
var svg = svg_wrap.contentDocument;

注意

尽管名称不同，

frameElement

也适用于使用

或

同上，见：

的确如此