在对象元素中检索SVG Dom作为文本

Question

我试图弄清楚如何通过Javascript将整个svg-dom检索为变量中的文本。

我没有问题引用嵌入式svg文件。但是SVG元素上的innerHTML或outerHTML将无法工作，我希望我不必遍历所有子节点和每个属性。

我的问题原因：

我想向我的网页访问者和我的学生提供svg代码，该代码由用户操作动态修改。

您可以在我的网站上查看毕达哥拉斯的例子：SVG sample with Pythagoras triangle

先谢谢你的帮助！这是我在这个网站上的第一个问题。

Answer 1

您用来嵌入SVG文件的<object />元素有效地充当文档容器，并且拥有自己的DOM。您可以通过以下方式访问SVG元素：

var objectElement = svgrwd; // or document.getElementById("svgrwd");
var svgDOM = objectElement.contentDocument;
var svgElement = svgDOM.documentElement; // returns the <svg /> element
var html = svgElement.outerHTML;

// or

svgrwd.contentDocument.documentElement.outerHTML

详细了解object元素：https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement