Element: setHTMLUnsafe() メソッド
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
setHTMLUnsafe() は Element インターフェイスのメソッドで、HTML の文字列を DocumentFragment として解釈し、DOM 内の要素のサブツリーを置き換えるために使用します。入力された HTML は宣言的シャドウルートを含むことがあります。
メソッド名の接尾辞 "Unsafe" は、そのメソッドが <script> 要素やスクリプト、イベントハンドラーのコンテンツ属性など、XSS に関連する安全でない可能性のある入力をサニタイズしたり除去したりしないことを示します。
HTML の文字列が特定のシャドウホストに複数の宣言的シャドウルートを定義している場合、最初の ShadowRoot だけが作成されます。以降の宣言は、そのシャドウルート内の <template> 要素として解釈できます。
メモ:
このメソッドは、HTML の文字列が宣言的なシャドウルートを格納する可能性がある場合に、Element.innerHTML の代わりに使用しましょう。
構文
js
setHTMLUnsafe(html)
引数
html-
解釈できる HTML を定義する文字列。
返値
なし (undefined)。
例外
なし。
例
下記のコードは、HTMLの文字列を解釈して target という要素を持つ Element に挿入する方法を示しています。
js
const value = "<p>これはテキストの文字列です</p>"; // HTML の文字列
// id が "target" の要素を取得し、文字列を設定する。
document.getElementById("target").setHTMLUnsafe(value);
// 結果（文字列として）: "<p>これはテキストの文字列です</p>"
仕様書
| Specification |
|---|
| HTML # dom-element-sethtmlunsafe |