XMLSerializer

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

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

インスタンスメソッド

serializeToString()

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

例

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

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

js
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 を使用して先にノードを文字列に変換します。

js
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 に挿入します。