JavaScriptでDOMノードまたはドキュメントをXMLに変換する

StackOverflow https://stackoverflow.com/questions/829574

  •  06-07-2019
  •  | 
  •  

質問

JavaScriptで単一のDOM要素またはドキュメント（window.documentなど）が渡されたとしたら、それをどのようにして有効なXMLに変換しますか？

私の例では、SVGを表示するWebページがあります。このSVGには、相互作用を可能にするJavaScriptがたくさんあります。これはグラフ表示であり、グラフを拡大したり、変換を行うこともできます。これで、ユーザーは「画像を保存」する必要があります。ボタン。私がこれを行うことを想像する方法は、SVG要素のドキュメントノードを取得し、XMLに変換し、それをサーバーに送信します。サーバーに送信すると、SVGドキュメントまたはPNG画像を含むページが返されます。

これはすべてFireFoxで実行されています（これは現在、ユーザーの要件ですが、SafariとChromeでも正常に動作します）。 Webページのfirefoxでは、SVGドキュメントをObject要素として含めました。 javascriptでは、XMLページのルートを参照するcontentDocumentオブジェクトにアクセスできます。 XMLバージョン、Documentタグ、およびすべての属性を持つルートsvgタグが含まれています。

誰かがすでにこれを解決しているので、コードをコピーできます。おそらく誰かがこれを達成するためにfirebugのどこを見るべきか知っているでしょう。または、このためのDOMメソッドが既にあるかもしれません。

役に立ちましたか？

解決

非標準のAPIオブジェクトがあります： XMLSerializer （標準ではありませんがIEブラウザ以外のすべてで実装されています）。

そのserializeToStringメソッドは、DOMNodeオブジェクトが渡されることを想定しています。

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

Internet Explorerでは、.outerHTMLを取得し、HTMLへのシリアル化に伴うすべての問題（属性内の引用符の欠落、閉じられたタグなどなど）を修正しない限り、HTMLの適切なXMLを取得する方法はありません

他のヒント

明日、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+"\">"
}
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top