ตัวอย่าง
แทนที่โหนดข้อความใน <li> องค์ประกอบในรายการกับโหนดข้อความใหม่:
// Create a new text node called "Water"
var textnode = document.createTextNode("Water");
// Get the first child node of an <ul> element
var item =
document.getElementById("myList").childNodes[0];
// Replace
the first child node of <ul> with the newly created text node
item.replaceChild(textnode, item.childNodes[0]);
// Note: This example replaces only the Text node
"Coffee" with a Text node "Water"
ก่อนที่จะลบ:
- Coffee
- Tea
- Milk
หลังจากลบ:
- Water
- Tea
- Milk
ลองตัวเอง» เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
replaceChild() วิธีการแทนที่โหนดเด็กที่มีโหนดใหม่
โหนดใหม่อาจจะเป็นโหนดที่มีอยู่ในเอกสารหรือคุณสามารถสร้างโหนดใหม่
เคล็ดลับ: ใช้ removeChild() วิธีการที่จะลบโหนดเด็กจากองค์ประกอบ
สนับสนุนเบราว์เซอร์
วิธี | |||||
---|---|---|---|---|---|
replaceChild() | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
วากยสัมพันธ์
ค่าพารามิเตอร์ พารามิเตอร์ ชนิด ลักษณะ newnode Node object จำเป็นต้องใช้ โหนดวัตถุที่คุณต้องการแทรก oldnode Node object จำเป็นต้องใช้ โหนดวัตถุที่คุณต้องการลบ
รายละเอียดทางเทคนิค
กลับค่า: วัตถุโหนดคิดเป็นโหนดแทนที่ DOM รุ่น ระดับแกนวัตถุ 1 โหนด
ตัวอย่างอื่น ๆ
ตัวอย่าง
แทนที่ <li> องค์ประกอบในรายการที่มีใหม่ <li> องค์ประกอบ:
// Create a new <li> element
var elmnt = document.createElement("li");
// Create a new text node called "Water"
var textnode = document.createTextNode("Water");
// Append the text
node to <li>
elmnt.appendChild(textnode);
// Get the <ul> element
with id="myList"
var item = document.getElementById("myList");
//
Replace the first child node (<li> with index 0) in <ul> with the newly
created <li> element
item.replaceChild(elmnt, item.childNodes[0]);
// Note: This example replaces the entire <li> element ก่อนที่จะลบ:
- Coffee
- Tea
- Milk
หลังจากลบ:
- Water
- Tea
- Milk
ลองตัวเอง»