appendChild方法用于在指定節點的子節點列表末尾添加新的子節點。
語法:
parentNode.appendChild(newNode);
其中,parentNode是要插入子節點的父節點,newNode是要插入的新節點。
示例:
// 創建新節點
var newElement = document.createElement("p");
var newText = document.createTextNode("這是新的段落");
newElement.appendChild(newText);
// 獲取父節點
var parentElement = document.getElementById("container");
// 插入新節點
parentElement.appendChild(newElement);
insertBefore方法用于在指定節點的子節點列表中的某個子節點前插入新的子節點。
語法:
parentNode.insertBefore(newNode, referenceNode);
其中,parentNode是要插入子節點的父節點,newNode是要插入的新節點,referenceNode是指定的參考節點,新節點將插入到該節點之前。
示例:
// 創建新節點
var newElement = document.createElement("p");
var newText = document.createTextNode("這是新的段落");
newElement.appendChild(newText);
// 獲取父節點
var parentElement = document.getElementById("container");
// 獲取參考節點
var referenceElement = document.getElementById("existingParagraph");
// 插入新節點
parentElement.insertBefore(newElement, referenceElement);
以上示例中,假設父節點的id是"container",存在一個id為"existingParagraph"的子節點。通過appendChild方法,將新節點插入到父節點的子節點列表末尾;通過insertBefore方法,將新節點插入到父節點的子節點列表中參考節點之前。