例
新しい挿入<li>の最初の子要素の前に要素を<ul>要素：
var newItem = document.createElement("LI"); // Create a <li> node
var textnode = document.createTextNode("Water"); // Create a text node
newItem.appendChild(textnode); // Append the text to <li>
var list =
document.getElementById("myList"); // Get the
<ul> element to insert a new node
list.insertBefore(newItem,
list.childNodes[0]); // Insert <li> before the first child of
<ul>挿入する前に：
- Coffee
- Tea
挿入した後：
- Water
- Coffee
- Tea
»それを自分で試してみてください もっと"Try it Yourself"以下の例。
定義と使用法
insertBefore()メソッドは、右のあなたが指定した既存の子、前に、子としてノードを挿入します。
ヒント：テキストで、新しいリスト項目を作成したい場合は、あなたがに追加するテキストノードとしてテキストを作成することを忘れないでください<li> そして 、要素を挿入します<li>リストに。
また、既存の要素を移動/挿入するためのinsertBeforeメソッドを使用することができます(See "More Examples") 。
ブラウザのサポート
表中の数字は完全に方法をサポートする最初のブラウザのバージョンを指定します。
| 方法 | |||||
|---|---|---|---|---|---|
| insertBefore() | はい | はい | はい | はい | はい |
構文
パラメータ値 パラメーター タイプ 説明 newnode Node object 必須。 挿入したいノードオブジェクト existingnode Node object 任意。 あなたが前に新しいノードを挿入したい子ノード。 指定されていない場合は、のinsertBeforeメソッドが最後にnewnodeを挿入します
技術的な詳細
戻り値： 挿入されたノードを表すノードオブジェクト、 DOMバージョン コアレベル1ノードオブジェクト
その他の例
例
移動<li>別のリストから要素を：
var node = document.getElementById("myList2").lastChild;
var
list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]); 挿入する前に：
- Coffee
- Tea
- Water
- Milk
insertBefore後：
- Milk
- Coffee
- Tea
- Water
»それを自分で試してみてください