3

JavaScriptで単一のDOM要素またはドキュメント(たとえばwindow.document)が渡されたとすると、それをどのように有効なXMLに変換しますか?

より具体的には、私の例では、SVGを表示するWebページがあります。このSVGには、対話を可能にするJavaScriptがたくさんあります。これは、グラフを拡大したり、いくつかの変換を行ったりできるグラフ表示です。これで、このユーザーは[画像を保存]ボタンが必要になります。これを行うと私が想像する方法は、SVG要素のドキュメントノードを取得してXMLに変換し、それをサーバーに送信することです。サーバーは、SVGドキュメントまたはPNG画像を含むページを返します。

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

多分誰かがすでにこれを解決しているので、私は彼らのコードをコピーすることができます。おそらく誰かがこれを達成するためにfirebugのどこを見ればよいか知っています。または、このためのDOMメソッドがすでに存在する可能性があります。

4

2 に答える 2

4

非標準のAPIオブジェクトであるXMLSerializerがあります(IEブラウザーを除くすべてのブラウザーに実装されていますが、標準ではありません)。

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

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

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

于 2009-05-06T13:59:31.770 に答える
1

明日は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+"\">"
}
于 2009-05-06T14:29:19.730 に答える