在對象元素中檢索SVG Dom作為文本

Question

我試圖弄清楚如何通過Javascript檢索整個svg-dom作為變量中的文本。

我沒有問題引用嵌入式svg文件。 但是SVG元素上的innerHTML或outerHTML將無法工作，我希望我不必遍歷所有子節點和每個屬性。

我的問題的原因：

我想向我的頁面的訪問者和我的學生提供由用戶操作動態修改的svg代碼。

您可以在我的網站上查看畢達哥拉斯的例子： 帶有畢達哥拉斯三角形的SVG樣本

在此先感謝您的幫助！ 這是我在這個網站上的第一個問題。

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