/
index.md
66 lines (43 loc) · 1.82 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
---
title: "DocumentFragment: replaceChildren() メソッド"
short-title: replaceChildren()
slug: Web/API/DocumentFragment/replaceChildren
l10n:
sourceCommit: 41a8b9c9832359d445d136b6d7a8a28737badc6b
---
{{APIRef("DOM")}}
**`DocumentFragment.replaceChildren()`** メソッドは、`DocumentFragment` の既存の子を指定された新しい子の集合で置き換えます。これらは文字列または {{domxref("Node")}} オブジェクトです。
## 構文
```js-nolint
replaceChildren(param1)
replaceChildren(param1, param2)
replaceChildren(param1, param2, /* … ,*/ paramN)
```
### 引数
- `param1`, …, `paramN`
- : 一連の {{domxref("Node")}} または文字列で、これで `DocumentFragment` の既存の子を置き換えます。置換するオブジェクトが指定されなかった場合、`DocumentFragment` は子ノードがすべて空になります。
### 返値
なし ({{jsxref("undefined")}})。
### 例外
- `HierarchyRequestError` {{DOMxRef("DOMException")}}
- : [ノードツリーの制約](https://dom.spec.whatwg.org/#concept-node-tree)に違反していた場合に発生します。
## 例
### 文書フラグメントを空にする
`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 []
```
## 仕様書
{{Specifications}}
## ブラウザーの互換性
{{Compat}}
## 関連情報
- {{domxref("DocumentFragment.prepend()")}}
- {{domxref("DocumentFragment.append()")}}