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パーサー)かのどちらで使用されるかによって異なる。

Document objects have a throw-on-dynamic-markup-insertion counter, which is used in conjunction with the create an element for the token algorithm to prevent custom element constructors from being able to use document.open(), document.close(), and document.write() when they are invoked by the parser. Initially, the counter must be set to zero.

8.4.1 入力ストリームを開く

document = document.open()

Document/open

Support in all current engines.

Firefox1+Safari11+Chrome64+
Opera51+Edge79+
Edge (Legacy)12+Internet Explorer4+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android47+

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

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

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

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

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

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

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

Document objects have an active parser was aborted boolean, which is used to prevent scripts from invoking the document.open() and document.write() methods (directly or indirectly) after the document's active parser has been aborted. 最初はfalseである。

The document open steps, given a document, are as follows:

  1. If document is an XML document, then throw an "InvalidStateError" DOMException exception.

  2. If document's throw-on-dynamic-markup-insertion counter is greater than 0, then throw an "InvalidStateError" DOMException.

  3. Let entryDocument be the entry global object's associated Document.

  4. If document's origin is not same origin to entryDocument's origin, then throw a "SecurityError" DOMException.

  5. If document has an active parser whose script nesting level is greater than 0, then return document.

    This basically causes document.open() to be ignored when it's called in an inline script found during parsing, while still letting it have an effect when called from a non-parser task such as a timer callback or event handler.

  6. Similarly, if document's unload counter is greater than 0, then return document.

    This basically causes document.open() to be ignored when it's called from a beforeunload, pagehide, or unload event handler while the Document is being unloaded.

  7. If document's active parser was aborted is true, then return document.

    This notably causes document.open() to be ignored if it is called after a navigation has started, but only during the initial parse. See issue #4723 for more background.

  8. If document's node navigable is non-null and document's node navigable's ongoing navigation is a navigation ID, then stop loading document's node navigable.

  9. For each shadow-including inclusive descendant node of document, erase all event listeners and handlers given node.

  10. If document is the associated Document of document's relevant global object, then erase all event listeners and handlers given document's relevant global object.

  11. Replace all with null within document.

  12. If document is fully active, then:

    1. Let newURL be a copy of entryDocument's URL.

    2. If entryDocument is not document, then set newURL's fragment to null.

    3. Run the URL and history update steps with document and newURL.

  13. Set document's is initial about:blank to false.

  14. If document's iframe load in progress flag is set, then set document's mute iframe load flag.

  15. Set document to no-quirks mode.

  16. Create a new HTML parser and associate it with document. This is a script-created parser (meaning that it can be closed by the document.open() and document.close() methods, and that the tokenizer will wait for an explicit call to document.close() before emitting an end-of-file token). The encoding confidence is irrelevant.

  17. Set the insertion point to point at just before the end of the input stream (which at this point will be empty).

  18. Update the current document readiness of document to "loading".

    This causes a readystatechange event to fire, but the event is actually unobservable to author code, because of the previous step which erased all event listeners and handlers that could observe it.

  19. documentを返す。

The document open steps do not affect whether a Document is ready for post-load tasks or completely loaded.

The open(unused1, unused2) method must return the result of running the document open steps with this.

The unused1 and unused2 arguments are ignored, but kept in the IDL to allow code that calls the function with one or two arguments to continue working. They are necessary due to Web IDL overload resolution algorithm rules, which would throw a TypeError exception for such calls had the arguments not been there. whatwg/webidl issue #581 investigates changing the algorithm to allow for their removal. [WEBIDL]

The open(url, name, features) method must run these steps:

  1. If this is not fully active, then throw an "InvalidAccessError" DOMException exception.

  2. Return the result of running the window open steps with url, name, and features.

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

document.close()

Document/close

Support in all current engines.

Firefox1+Safari11+Chrome64+
Opera51+Edge79+
Edge (Legacy)12+Internet Explorer4+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android47+

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

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

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

The close() method must run the following steps:

  1. If this is an XML document, then throw an "InvalidStateError" DOMException.

  2. If this's throw-on-dynamic-markup-insertion counter is greater than zero, then throw an "InvalidStateError" DOMException.

  3. If there is no script-created parser associated with this, then return.

  4. Insert an explicit "EOF" character at the end of the parser's input stream.

  5. If this's pending parsing-blocking script is not null, then return.

  6. Run the tokenizer, processing resulting tokens as they are emitted, and stopping when the tokenizer reaches the explicit "EOF" character or spins the event loop.

8.4.3 document.write()

document.write(...text)

Document/write

Support in all current engines.

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

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

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

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

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

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

Document objects have an ignore-destructive-writes counter, which is used in conjunction with the processing of script elements to prevent external scripts from being able to use document.write() to blow away the document by implicitly calling document.open(). Initially, the counter must be set to zero.

The document write steps, given a Document object document, a list text, a boolean lineFeed and a string sink, are as follows:

  1. Let string be the empty string.

  2. Let isTrusted be false if text contains a string; otherwise true.

  3. For each value of text:

    1. If value is a TrustedHTML object, then append value's associated data to string.

    2. Otherwise, append value to string.

  4. If isTrusted is false, set string to the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, string, sink, and "script".

  5. If lineFeed is true, append U+000A LINE FEED to string.

  6. If document is an XML document, then throw an "InvalidStateError" DOMException.

  7. If document's throw-on-dynamic-markup-insertion counter is greater than 0, then throw an "InvalidStateError" DOMException.

  8. If document's active parser was aborted is true, then return.

  9. If the insertion point is undefined, then:

    1. If document's unload counter is greater than 0 or document's ignore-destructive-writes counter is greater than 0, then return.

    2. Run the document open steps with document.

  10. Insert string into the input stream just before the insertion point.

  11. If document's pending parsing-blocking script is null, then have the HTML parser process string, one code point at a time, processing resulting tokens as they are emitted, and stopping when the tokenizer reaches the insertion point or when the processing of the tokenizer is aborted by the tree construction stage (this can happen if a script end tag token is emitted by the tokenizer).

    If the document.write() method was called from script executing inline (i.e. executing because the parser parsed a set of script tags), then this is a reentrant invocation of the parser. If the parser pause flag is set, the tokenizer will abort immediately and no HTML will be parsed, per the tokenizer's parser pause flag check.

The document.write(...text) method steps are to run the document write steps with this, text, false, and "Document write".

8.4.4 document.writeln()

document.writeln(...text)

Document/writeln

Support in all current engines.

Firefox1+Safari11+Chrome64+
Opera51+Edge79+
Edge (Legacy)12+Internet Explorer4+
Firefox Android?Safari iOS?Chrome Android?WebView Android?Samsung Internet?Opera Android47+

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

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

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

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

The document.writeln(...text) method steps are to run the document write steps with this, text, true, and "Document writeln".

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+
partial interface Element {
  [CEReactions] undefined setHTMLUnsafe((TrustedHTML or DOMString) html);
  DOMString getHTML(optional GetHTMLOptions options = {});

  [CEReactions] attribute (TrustedHTML or [LegacyNullToEmptyString] DOMString) innerHTML;
  [CEReactions] attribute (TrustedHTML or [LegacyNullToEmptyString] DOMString) outerHTML;
  [CEReactions] undefined insertAdjacentHTML(DOMString position, (TrustedHTML or DOMString) string);
};

partial interface ShadowRoot {
  [CEReactions] undefined setHTMLUnsafe((TrustedHTML or DOMString) html);
  DOMString getHTML(optional GetHTMLOptions options = {});

  [CEReactions] attribute (TrustedHTML or [LegacyNullToEmptyString] DOMString) innerHTML;
};

dictionary GetHTMLOptions {
  boolean serializableShadowRoots = false;
  sequence<ShadowRoot> shadowRoots = [];
};

8.5.1 The DOMParser interface

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

parser = new DOMParser()

DOMParser/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+

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

document = parser.parseFromString(string, type)

DOMParser/parseFromString

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+

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またはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

[Exposed=Window]
interface DOMParser {
  constructor();

  [NewObject] Document parseFromString((TrustedHTML or DOMString) string, DOMParserSupportedType type);
};

enum DOMParserSupportedType {
  "text/html",
  "text/xml",
  "application/xml",
  "application/xhtml+xml",
  "image/svg+xml"
};

The new DOMParser() constructor steps are to do nothing.

The parseFromString(string, type) method steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, string, "DOMParser parseFromString", and "script".

  2. Let document be a new Document, whose content type is type and URL is this's relevant global object's associated Document's URL.

    The document's encoding will be left as its default, of UTF-8. In particular, any XML declarations or meta elements found while parsing compliantString will have no effect.

  3. Switch on type:

    "text/html"
    1. Parse HTML from a string given document and compliantString.

    Since document does not have a browsing context, scripting is disabled.

    Otherwise
    1. Create an XML parser parser, associated with document, and with XML scripting support disabled.

    2. Parse compliantString using parser.

    3. If the previous step resulted in an XML well-formedness or XML namespace well-formedness error, then:

      1. Assert: document has no child nodes.

      2. Let root be the result of creating an element given document, "parsererror", and "http://www.mozilla.org/newlayout/xml/parsererror.xml".

      3. Optionally, add attributes or children to root to describe the nature of the parsing error.

      4. Append root to document.

  4. documentを返す。

To parse HTML from a string, given a Document document and a string html:

  1. Set document's type to "html".

  2. Create an HTML parser parser, associated with document.

  3. Place html into the input stream for parser. The encoding confidence is irrelevant.

  4. Start parser and let it run until it has consumed all the characters just inserted into the input stream.

    This might mutate the document's mode.

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またはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

Element's setHTMLUnsafe(html) method steps are:

  1. Let compliantHTML be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, html, "Element setHTMLUnsafe", and "script".

  2. Let target be this's template contents if this is a template element; otherwise this.

  3. Unsafely set HTML given target, this, and compliantHTML.

ShadowRoot's setHTMLUnsafe(html) method steps are:

  1. Let compliantHTML be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, html, "ShadowRoot setHTMLUnsafe", and "script".

  2. Unsafely set HTML given this, this's shadow host, and compliantHTML.

To unsafely set HTML, given an Element or DocumentFragment target, an Element contextElement, and a string html:

  1. Let newChildren be the result of the HTML fragment parsing algorithm given contextElement, html, and true.

  2. Let fragment be a new DocumentFragment whose node document is contextElement's node document.

  3. For each node in newChildren, append node to fragment.

  4. Replace all with fragment within target.


The static parseHTMLUnsafe(html) method steps are:

  1. Let compliantHTML be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, html, "Document parseHTMLUnsafe", and "script".

  2. Let document be a new Document, whose content type is "text/html".

    Since document does not have a browsing context, scripting is disabled.

  3. Set document's allow declarative shadow roots to true.

  4. Parse HTML from a string given document and compliantHTML.

  5. documentを返す。

8.5.3 HTMLシリアル化メソッド

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

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

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

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

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

Element's getHTML(options) method steps are to return the result of HTML fragment serialization algorithm with this, options["serializableShadowRoots"], and options["shadowRoots"].

ShadowRoot's getHTML(options) method steps are to return the result of HTML fragment serialization algorithm with this, options["serializableShadowRoots"], and options["shadowRoots"].

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またはイベントハンドラーコンテンツ属性などの潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

The fragment serializing algorithm steps, given an Element, Document, or DocumentFragment node and a boolean require well-formed, are:

  1. Let context document be node's node document.

  2. If context document is an HTML document, return the result of HTML fragment serialization algorithm with node, false, and « ».

  3. Return the XML serialization of node given require well-formed.

The fragment parsing algorithm steps, given an Element context and a string markup, are:

  1. Let algorithm be the HTML fragment parsing algorithm.

  2. If context's node document is an XML document, then set algorithm to the XML fragment parsing algorithm.

  3. Let newChildren be the result of invoking algorithm given context and markup.

  4. Let fragment be a new DocumentFragment whose node document is context's node document.

  5. For each node of newChildren, in tree order: append node to fragment.

    This ensures the node document for the new nodes is correct.

  6. Return fragment.

Element's innerHTML getter steps are to return the result of running fragment serializing algorithm steps with this and true.

ShadowRoot's innerHTML getter steps are to return the result of running fragment serializing algorithm steps with this and true.

Element's innerHTML setter steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, the given value, "Element innerHTML", and "script".

  2. Let context be this.

  3. Let fragment be the result of invoking the fragment parsing algorithm steps with context and compliantString.

  4. If context is a template element, then set context to the template element's template contents (a DocumentFragment).

    Setting innerHTML on a template element will replace all the nodes in its template contents rather than its children.

  5. Replace all with fragment within context.

ShadowRoot's innerHTML setter steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, the given value, "ShadowRoot innerHTML", and "script".

  2. Let context be this's host.

  3. Let fragment be the result of invoking the fragment parsing algorithm steps with context and compliantString.

  4. Replace all with fragment within this.

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またはイベントハンドラーコンテンツ属性などの潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

Element's outerHTML getter steps are:

  1. Let element be a fictional node whose only child is this.

  2. Return the result of running fragment serializing algorithm steps with element and true.

Element's outerHTML setter steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, the given value, "Element outerHTML", and "script".

  2. Let parent be this's parent.

  3. If parent is null, return. There would be no way to obtain a reference to the nodes created even if the remaining steps were run.

  4. If parent is a Document, throw a "NoModificationAllowedError" DOMException.

  5. If parent is a DocumentFragment, set parent to the result of creating an element given this's node document, "body", and the HTML namespace.

  6. Let fragment be the result of invoking the fragment parsing algorithm steps given parent and compliantString.

  7. Replace this with fragment within this's parent.

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またはイベントハンドラーコンテンツ属性のような潜在的に危険な要素および属性を削除するためのサニタイズを実行しない。

Element's insertAdjacentHTML(position, string) method steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, string, "Element insertAdjacentHTML", and "script".

  2. Let context be null.

  3. Use the first matching item from this list:

    If position is an ASCII case-insensitive match for the string "beforebegin"
    If position is an ASCII case-insensitive match for the string "afterend"
    1. Set context to this's parent.

    2. If context is null or a Document, throw a "NoModificationAllowedError" DOMException.

    If position is an ASCII case-insensitive match for the string "afterbegin"
    If position is an ASCII case-insensitive match for the string "beforeend"
    Set context to this.
    そうでなければ

    Throw a "SyntaxError" DOMException.

  4. If context is not an Element or all of the following are true:

    set context to the result of creating an element given this's node document, "body", and the HTML namespace.

  5. Let fragment be the result of invoking the fragment parsing algorithm steps with context and compliantString.

  6. Use the first matching item from this list:
    If position is an ASCII case-insensitive match for the string "beforebegin"

    Insert fragment into this's parent before this.

    If position is an ASCII case-insensitive match for the string "afterbegin"

    Insert fragment into this before its first child.

    If position is an ASCII case-insensitive match for the string "beforeend"

    Append fragment to this.

    If position is an ASCII case-insensitive match for the string "afterend"

    Insert fragment into this's parent before this's next sibling.

As with other direct Node-manipulation APIs (and unlike innerHTML), insertAdjacentHTML() does not include any special handling for template elements. In most cases you will want to use templateEl.content.insertAdjacentHTML() instead of directly manipulating the child nodes of a template element.

8.5.7 createContextualFragment()メソッド

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

docFragment = range.createContextualFragment(string)

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

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

partial interface Range {
  [CEReactions, NewObject] DocumentFragment createContextualFragment((TrustedHTML or DOMString) string);
};

Range's createContextualFragment(string) method steps are:

  1. Let compliantString be the result of invoking the Get Trusted Type compliant string algorithm with TrustedHTML, this's relevant global object, string, "Range createContextualFragment", and "script".

  2. Let node be this's start node.

  3. Let element be null.

  4. If node implements Element, set element to node.

  5. Otherwise, if node implements Text or Comment, set element to node's parent element.

  6. If element is null or all of the following are true:

    then set element to the result of creating an element given this's node document, "body", and the HTML namespace.

  7. Let fragment node be the result of invoking the fragment parsing algorithm steps with element and compliantString.

  8. For each script of fragment node's script element descendants:

    1. Set script's already started to false.

    2. Set script's parser document to null.

  9. Return fragment node.