DocumentFragment: replaceChildren() メソッド
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
DocumentFragment.replaceChildren() メソッドは、DocumentFragment の既存の子を指定された新しい子の集合で置き換えます。これらは文字列または Node オブジェクトです。
構文
js
replaceChildren(param1)
replaceChildren(param1, param2)
replaceChildren(param1, param2, /* … ,*/ paramN)
引数
param1, …,paramN-
一連の
Nodeまたは文字列で、これでDocumentFragmentの既存の子を置き換えます。置換するオブジェクトが指定されなかった場合、DocumentFragmentは子ノードがすべて空になります。
返値
なし (undefined)。
例外
HierarchyRequestErrorDOMException-
ノードツリーの制約に違反していた場合に発生します。
例
文書フラグメントを空にする
replaceChildren() は文書フラグメントの子ノードをすべて空にする、とても便利な方法を提供します。引数を指定せずに呼び出せばよいのです。
js
let fragment = new DocumentFragment();
let div = document.createElement("div");
let p = document.createElement("p");
fragment.append(p);
fragment.prepend(div);
fragment.children; // HTMLCollection [<div>, <p>]
fragment.replaceChildren();
fragment.children; // HTMLCollection []
仕様書
| Specification |
|---|
| DOM Standard # ref-for-dom-parentnode-replacechildren① |
ブラウザーの互換性
BCD tables only load in the browser