XMLSerializer

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。

XMLSerializer インターフェイスは serializeToString() メソッドを提供します。これにより、 DOM ツリーを表す XML 文字列を構築することができます。

インスタンスメソッド

serializeToString(): 文字列の形にシリアライズされたサブツリーを返します。

例

XML を文字列にシリアライズ

最初の基本的な例は、文書全体を XML を含む文字列にシリアライズします。

const s = new XMLSerializer();
const d = document;
const str = s.serializeToString(d);
saveXML(str);

このコードは、新しい XMLSerializer オブジェクトを作成し、シリアライズされる Document を serializeToString() に渡します。これは、渡した文書と同等の XML を返します。

XML を基にした DOM にノードを挿入する

この例は、Element.insertAdjacentHTML() メソッドを使用して新しい DOM Node を Document の body に挿入します。これは、Element オブジェクトをシリアライズすることにより作成された XML を基にしています。

メモ: 実際は、importNode() メソッドを呼び出して新しいノードを DOM に挿入する代わりに、以下のいずれかのメソッドを呼び出して DOM ツリーに追加することになるでしょう。

Element.append() / Element.prepend() および Document.append() / Document.prepend() メソッド
Element.replaceWith() メソッド（既存のノードを新しいノードと置き換えるため）
Document.insertAdjacentElement() および Element.insertAdjacentElement() メソッド

insertAdjacentHTML() は文字列を受け入れるますが、2 番目の引数として Node を受け入れないため、XMLSerializer を使用して先にノードを文字列に変換します。

const inp = document.createElement("input");
const XMLS = new XMLSerializer();
const inp_xmls = XMLS.serializeToString(inp); // まず DOM ノードを文字列に変換

// 新たに作成されたノードを文書の body に挿入
document.body.insertAdjacentHTML("afterbegin", inp_xmls);

このコードは、Document.createElement() を呼び出して新しい <input> 要素を作成し、serializeToString() を使用して XML にシリアライズします。

完了したら、insertAdjacentHTML() を使用して <input> 要素を DOM に挿入します。