diff options
Diffstat (limited to 'files/ja/web/api/element/before')
-rw-r--r-- | files/ja/web/api/element/before/index.html | 91 | ||||
-rw-r--r-- | files/ja/web/api/element/before/index.md | 92 |
2 files changed, 92 insertions, 91 deletions
diff --git a/files/ja/web/api/element/before/index.html b/files/ja/web/api/element/before/index.html deleted file mode 100644 index 652f38c95f..0000000000 --- a/files/ja/web/api/element/before/index.html +++ /dev/null @@ -1,91 +0,0 @@ ---- -title: Element.before() -slug: Web/API/Element/before -tags: - - API - - DOM - - Method - - Node - - Reference -browser-compat: api.Element.before -translation_of: Web/API/Element/before -original_slug: Web/API/ChildNode/before ---- -<div>{{APIRef("DOM")}}</div> - -<p><code><strong>Element.before()</strong></code> は一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトを、この <code>Element</code> の親の子リストの中、この <code>Element</code> の直前に挿入します。 {{domxref("DOMString")}} オブジェクトは {{domxref("Text")}} ノードと等価なノードとして挿入されます。</p> - -<h2 id="Syntax">構文</h2> - -<pre class="brush: js">before(... nodes)</pre> - -<h3 id="Parameters">引数</h3> - -<dl> - <dt><code>nodes</code></dt> - <dd>挿入する一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトです。</dd> -</dl> - -<h3 id="Exceptions">例外</h3> - -<ul> - <li>{{domxref("HierarchyRequestError")}}: 階層の指定の位置にノードを挿入できない。</li> -</ul> - -<h2 id="Examples">例</h2> - -<h3 id="Inserting_an_element">要素の挿入</h3> - -<pre class="brush: js">let container = document.createElement("div"); -let p = document.createElement("p"); -container.appendChild(p); -let span = document.createElement("span"); - -p.before(span); - -console.log(container.outerHTML); -// "<div><span></span><p></p></div>" -</pre> - -<h3 id="Inserting_text">テキストの挿入</h3> - -<pre class="brush: js">let container = document.createElement("div"); -let p = document.createElement("p"); -container.appendChild(p); - -p.before("Text"); - -console.log(container.outerHTML); -// "<div>Text<p></p></div>"</pre> - -<h3 id="Inserting_an_element_and_text">要素とテキストの挿入</h3> - -<pre class="brush: js">let container = document.createElement("div"); -let p = document.createElement("p"); -container.appendChild(p); -let span = document.createElement("span"); - -p.before(span, "Text"); - -console.log(container.outerHTML); -// "<div><span></span>Text<p></p></div>"</pre> - - -<h2 id="Specification">仕様書</h2> - -{{Specifications}} - -<h2 id="Browser_compatibility">ブラウザーの互換性</h2> - -<p>{{Compat}}</p> - -<h2 id="See_also">関連情報</h2> - -<ul> - <li>{{domxref("Element.after()")}}</li> - <li>{{domxref("Element.append()")}}</li> - <li>{{domxref("Node.appendChild()")}}</li> - <li>{{domxref("Node.insertBefore()")}}</li> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("NodeList")}}</li> -</ul> diff --git a/files/ja/web/api/element/before/index.md b/files/ja/web/api/element/before/index.md new file mode 100644 index 0000000000..2bef18e920 --- /dev/null +++ b/files/ja/web/api/element/before/index.md @@ -0,0 +1,92 @@ +--- +title: Element.before() +slug: Web/API/Element/before +tags: + - API + - DOM + - メソッド + - Node + - リファレンス +browser-compat: api.Element.before +translation_of: Web/API/Element/before +original_slug: Web/API/ChildNode/before +--- +{{APIRef("DOM")}} + +**`Element.before()`** は一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトを、この `Element` の親の子リストの中、この `Element` の直前に挿入します。 {{domxref("DOMString")}} オブジェクトは {{domxref("Text")}} ノードと等価なノードとして挿入されます。 + +## 構文 + +```js +before(... nodes) +``` + +### 引数 + +- `nodes` + - : 挿入する一連の {{domxref("Node")}} または {{domxref("DOMString")}} オブジェクトです。 + +### 例外 + +- `HierarchyRequestError` {{DOMxRef("DOMException")}} + - : ノードが階層構造の中の指定された位置に挿入できなかったときに発生します。 + +## 例 + +### 要素の挿入 + +```js +let container = document.createElement("div"); +let p = document.createElement("p"); +container.appendChild(p); +let span = document.createElement("span"); + +p.before(span); + +console.log(container.outerHTML); +// "<div><span></span><p></p></div>" +``` + +### テキストの挿入 + +```js +let container = document.createElement("div"); +let p = document.createElement("p"); +container.appendChild(p); + +p.before("Text"); + +console.log(container.outerHTML); +// "<div>Text<p></p></div>" +``` + +### 要素とテキストの挿入 + +```js +let container = document.createElement("div"); +let p = document.createElement("p"); +container.appendChild(p); +let span = document.createElement("span"); + +p.before(span, "Text"); + +console.log(container.outerHTML); +// "<div><span></span>Text<p></p></div>" +``` + +## 仕様書 + +{{Specifications}} + +## ブラウザーの互換性 + +{{Compat}} + +## 関連情報 + +- {{domxref("Element.after()")}} +- {{domxref("Element.append()")}} +- {{domxref("Node.appendChild()")}} +- {{domxref("Node.insertBefore()")}} +- {{domxref("Element.insertAdjacentElement()")}} +- {{domxref("NodeList")}} |