1. 8.4 動的マークアップの挿入
      1. 8.4.1 入力ストリームを開く
      2. 8.4.2 入力ストリームを閉じる
      3. 8.4.3 document.write()
      4. 8.4.4 document.writeln()
    2. 8.5 DOM解析およびシリアライゼーションAPI
      1. 8.5.1 DOMParserインターフェイス
      2. 8.5.2 安全でないHTML解析メソッド
      3. 8.5.3 HTMLシリアル化メソッド
      4. 8.5.4 innerHTMLプロパティ
      5. 8.5.5 outerHTMLプロパティ
      6. 8.5.6 insertAdjacentHTML()メソッド
      7. 8.5.7 createContextualFragment()メソッド

8.4 動的マークアップの挿入

マークアップを文書に動的に挿入するためのAPIはパーサーと相互作用するため、その動作は、HTML文書(およびHTMLパーサー)かXML文書(およびXMLパーサー)かのどちらで使用されるかによって異なる。

8.4.1 入力ストリームを開く

document = document.open()

前のオブジェクトを再利用する場合を除き、あたかもそれが新しいDocumentオブジェクトであるかのように、Documentに正しい場所で置換され、その後返される。

結果として得られるDocumentはHTMLパーサーが関連付けられており、 document.write()を使用して解析するデータを与えることができる。

Documentがまだ解析されている場合、メソッドは効果がない。

DocumentXML文書である場合、"InvalidStateError" DOMExceptionを投げる。

パーサーがカスタム要素コンストラクターを現在実行している場合、"InvalidStateError" DOMExceptionを投げる。

window = document.open(url, name, features)

window.open()メソッドのように動作する。

8.4.2 入力ストリームを閉じる

document.close()

document.open()メソッドによって開かれた入力ストリームを閉じる。

DocumentXML文書である場合、"InvalidStateError" DOMExceptionを投げる。

パーサーがカスタム要素コンストラクターを現在実行している場合、"InvalidStateError" DOMExceptionを投げる。

8.4.3 document.write()

document.write(...text)

一般に、与えられた文字列をDocumentの入力ストリームに加える。

このメソッドは非常に特異な振る舞いを持つ。一部の場合において、このメソッドは、パーサーが実行されている間、HTMLパーサーの状態に影響を与えることができる。その結果、文書のソースに対応しないDOMをもたらす(たとえば、記述された文字列が、文字列"<plaintext>"または"<!--"である場合)。他の例では、あたかもdocument.open()が呼び出されていたかのように、呼び出しが最初に現在のページをクリアできる。さらに多くの例では、メソッドは単に無視されるか、または例外を投げる。ユーザーエージェントは、このメソッドを介して挿入されたscript要素の実行を回避することを明示的に許可される。さらに悪いことに、このメソッドの正確な動作は、場合によってはネットワーク遅延に依存する可能性があり、これはデバッグが非常に困難な障害につながる可能性がある。これらすべての理由から、このメソッドの使用は強く勧めない。

XML文書で呼び出されるとき、"InvalidStateError" DOMExceptionを投げる。

パーサーがカスタム要素コンストラクターを現在実行している場合、"InvalidStateError" DOMExceptionを投げる。

このメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.4.4 document.writeln()

document.writeln(...text)

改行文字の後に、与えられた文字列をDocumentの入力ストリームに加える。必要ならば、open()メソッドを暗黙のうちに最初に呼び出す。

XML文書で呼び出されるとき、"InvalidStateError" DOMExceptionを投げる。

パーサーがカスタム要素コンストラクターを現在実行している場合、"InvalidStateError" DOMExceptionを投げる。

このメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5 DOM解析およびシリアライゼーションAPI

DOMParser

Support in all current engines.

Firefox1+Safari1.3+Chrome1+
Opera8+Edge79+
Edge (Legacy)12+Internet Explorer9+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android10.1+

8.5.1 DOMParserインターフェイス

DOMParser インターフェイスは、HTMLまたはXMLのいずれかとして、文字列を解析することで新しいDocumentオブジェクトを作成することを可能にする。

parser = new DOMParser()

新しいDOMParserオブジェクトを構築する。

document = parser.parseFromString(string, type)

typeに応じて、HTMLまたはXMLパーサーのいずれかを使用して文字列を解析し、結果のDocumentを返す。typeは、"text/html"(HTMLパーサーを呼び出す)、または"text/xml"、"application/xml"、"application/xhtml+xml"、もしくは"image/svg+xml"(XMLパーサーを呼び出す)。

XMLパーサーの場合、文字列を解析できない場合、返されるDocumentは、結果のエラーを説明する要素が含まれる。

script 要素は解析中に評価されず、結果の文書のエンコーディングは常にUTF-8となることに注意する。文書のURLは、parser関連するグローバルオブジェクトから継承される。

typeに上記以外の値を指定すると、TypeError例外が投げられる。

構築してからparseFromString()メソッドを呼び出す必要があるクラスとしてのDOMParserの設計は、不幸な歴史的成果物である。もし今日にこの機能を設計していたとしたら、それはスタンドアロン機能になっただろう。HTMLを解析する場合、現在の代替手段はDocument.parseHTMLUnsafe()である。

このメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5.2 安全でないHTML解析メソッド

element.setHTMLUnsafe(html)

HTMLパーサーを使用してhtmlを解析し、elementの子を結果に置き換える。elementは、HTMLパーサーのコンテキストを提供する。

shadowRoot.setHTMLUnsafe(html)

HTMLパーサーを使用してhtmlを解析し、shadowRootの子を結果に置き換える。shadowRoothostは、HTMLパーサーのコンテキストを提供する。

doc = Document.parseHTMLUnsafe(html)

HTMLパーサーを使用してhtmlを解析し、結果のDocumentを返す。

script 要素は解析中に評価されず、結果の文書のエンコーディングは常にUTF-8となることに注意する。文書のURLは、about:blankになる。

これらのメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5.3 HTMLシリアル化メソッド

html = element.getHTML({ serializableShadowRoots, shadowRoots })

elementをHTMLにシリアル化した結果を返す。element内のシャドウルートは、指定されたオプションに従ってシリアル化される。

どちらのオプションも指定しない場合、シャドウルートはシリアル化されない。

html = shadowRoot.getHTML({ serializableShadowRoots, shadowRoots })

コンテキスト要素としてシャドウホストを使用して、shadowRootをHTMLにシリアル化した結果を返す。shadowRoot内のシャドウルートは、上記のように、指定されたオプションに従ってシリアル化される。

8.5.4 innerHTMLプロパティ

innerHTMLプロパティには、DOM Parsing and Serialization issue trackerに未解決の問題が多数あり、その仕様に関するさまざまな問題が文書化されている。

element.innerHTML

要素の内容を表すHTMLまたはXMLのフラグメントを返す。

XML文書の場合、要素をXMLにシリアル化できない場合、"InvalidStateError" DOMExceptionを投げる。

element.innerHTML = value

要素の内容を、指定された文字列から解析されたノードに置き換える。

XML文書の場合、指定した文字列が整形式でない場合、"SyntaxError" DOMExceptionを投げる。

shadowRoot.innerHTML

シャドウルートの内容を表すHTMLのフラグメントを返す。

shadowRoot.innerHTML = value

シャドウルートの内容を、指定した文字列から解析されたノードに置き換える。

これらのプロパティのセッターは、scriptまたはイベントハンドラーコンテンツ属性などの潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5.5 outerHTMLプロパティ

outerHTMLプロパティには、DOM Parsing and Serialization issue trackerに未解決の問題が多数あり、その仕様に関するさまざまな問題が文書化されている。

element.outerHTML

要素とその内容を表すHTMLまたはXMLのフラグメントを返す。

XML文書の場合、要素をXMLにシリアル化できない場合、"InvalidStateError" DOMExceptionを投げる。

element.outerHTML = value

要素を、指定された文字列から解析されたノードに置き換える。

XML文書の場合、指定した文字列が整形式でない場合、"SyntaxError" DOMExceptionを投げる。

要素の親がDocumentである場合、"NoModificationAllowedError" DOMExceptionを返す。

このプロパティのセッターは、scriptまたはイベントハンドラーコンテンツ属性などの潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5.6 insertAdjacentHTML()メソッド

insertAdjacentHTML()メソッドには、DOM Parsing and Serialization issue trackerに未解決の問題が多数あり、その仕様に関するさまざまな問題が文書化されている。

element.insertAdjacentHTML(position, string)

stringをHTMLまたはXMLとして解析し、結果のノードを次のようにposition引数で指定された位置にツリーに挿入する:

"beforebegin"
要素自体の前(つまり、elementの前の兄弟の後)
"afterbegin"
要素のすぐ内側で、最初の子の前。
"beforeend"
要素の内部で、最後の子の後。
"afterend"
要素自体の前(つまり、elementの次の兄弟の前)

引数に無効な値が含まれている場合に"SyntaxError" DOMExceptionを投げる(たとえば、XML文書の場合、指定された文字列が整形式でない場合)。

指定した位置が使用できない場合に"NoModificationAllowedError" DOMExceptionを投げる(たとえば、Documentのルート要素の後に要素を挿入する場合など)。

このメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

8.5.7 createContextualFragment()メソッド

createContextualFragment()メソッドには、DOM Parsing and Serialization issue trackerに未解決の問題が多数あり、その仕様に関するさまざまな問題が文書化されている。

docFragment = range.createContextualFragment(string)

fragmentが解析されるコンテキストとしてrange開始ノードを使用して、マークアップ文字列stringから作成された DocumentFragmentを返す。

このメソッドは、scriptまたはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。