将对象元素中的 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

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

Retrieve SVG Dom in object element as text

javascript

svg