在JavaScript中将DOM节点或文档转换为XML

Question

假设您在JavaScript中传递了单个DOM元素或Document（例如window.document），您将如何将其转换为有效的XML？

更具体地说，我的示例中，我有一个显示SVG的网页，这个SVG有很多JavaScript允许交互。这是一个图形显示，让你放大图形甚至进行一些转换。现在，用户想要获得“保存图像”。按钮。我想这样做的方法是获取SVG元素的文档节点，并将其转换为XML，然后将其发送到服务器，然后服务器返回包含SVG文档或PNG图像的页面。

这一切都在FireFox上运行（目前这是用户的要求，尽管它在Safari和Chrome中也能正常运行）。在网页的firefox中，我将SVG文档作为Object元素包含在内。在javascript中，我可以访问对象contentDocument，它引用XML页面的根。它包含XML版本，Document标记和包含所有属性的根svg标记。

也许某人已经解决了这个问题，所以我可以复制他们的代码。也许有人知道在哪里可以看到萤火虫来实现这一目标。或者也许已有DOM方法。

Answer 1

有一个非标准的API对象： XMLSerializer （虽然它不是标准的在除IE浏览器之外的所有浏览器中实现。）

它的serializeToString方法需要传递DOMNode对象。

var sXML = new XMLSerializer().serializeToString(document.body);

在Internet Explorer中，无法为HTML检索正确的XML，除非获取.outerHTML并将序列化带来的所有问题修复为HTML（例如缺少属性中的引号，而不是关闭标记等）。

Answer 2

明天我将不得不研究XMLSerializer。以下是我最终编写的代码，以防任何人感兴趣（需要原型和FireBug用于未知节点）：

function extractXML(node) {
    switch (node.nodeType) {
        case 1: return extractNodeXML(node);
        case 2: return extractAttributeXML(node);
        // 3 = Text node
        case 3: return node.nodeValue;
        // 8 = Comment node - ignore
        case 8: return "";
        case 9: return extractDocumentNodeXML(node);
        case 10: return extractDocumentTypeXML(node);
        default: console.log(node); return "Unkwon type: "+node.nodeType;
    }
}
function extractNodeXML(node) {
    var xml = "<"+node.nodeName;
    $A(node.attributes).each(function (node) {xml += " "+extractXML(node)});
    xml +=">"
    $A(node.childNodes).each(function (node) {xml += extractXML(node)});
    xml += "</"+node.nodeName+">"
    return xml;
}
function extractAttributeXML(node) {
    return node.nodeName+"=\""+node.nodeValue+"\""
}
function extractDocumentNodeXML(node) {
    var xml = "<?xml version=\""+node.xmlVersion+"\" encoding=\""+node.xmlEncoding+"\"?>"
    $A(node.childNodes).each(function (node) {xml += extractXML(node)});
    return xml;
}
function extractDocumentTypeXML(node) {
    return "<!DOCTYPE "+node.name+" PUBLIC \""+node.publicId+"\" \""+node.systemId+"\">"
}