HTML DOM Element removeChild() method
- ຫນ້າທີ່ກ່ອນ removeAttributeNode()
- ຫນ້າທີ່ຕໍ່ໄປ removeEventListener()
- ກັບຄືນຖະໜົນຕໍ່າ ບັນດາວ່າງ HTML DOM Elements
ການອະທິບາຍ ແລະ ການນໍາໃຊ້
removeChild() ວິທີການປົດອອກລູກພັກຂອງຫຼັກສັບ.
ວິທີການດັ່ງກ່າວກັບ Node object; ຖ້າຫຼັກສັບບໍ່ມີຢູ່, ກັບຄືນອອກ: null.
ຄຳແນະນຳ:
ພັກລູກຈາກທີ່ຖືກຖອນອອກຈາກ DOM (Document Object Model).
ແຕ່ສາມາດດັດແປງຂອງຫຼັກສັບທີ່ຖືກຖອນອອກແລະສົ່ງຄືນໄປໃນ DOM (ຄວາມຄິດຈະປະກອບລຸ່ມ).
ບໍ່ອາດທຳນາຍ:
ຄວາມຄິດຈະປະກອບ:
ຄຳວັດ 1
ຈາກສາຍພັກປົດອອກພັກທຳອິດ:
const list = document.getElementById("myList");
list.removeChild(list.firstElementChild);
ກ່ອນປົດອອກ:
- ພາກສານ:
- ພາກສານ:
- ພາກສານ:
ຫຼັງຈາກປົດອອກ:
- ພາກສານ:
- ພາກສານ:
ຄຳວັດ 2
ຖ້າສາຍພັກມີພັກລູກຫຼັງຈາກມັນປົດອອກພັກທີ່ມີບ່ອນຕັ້ງ 0:
const list = document.getElementById("myList");
if (list.hasChildNodes()) {
list.removeChild(list.children[0]);
}
ຄຳວັດ 3
ຈາກສາຍພັກຂອງມັນປົດອອກທຸກພັກທີ່ມີລູກພັກ:
const list = document.getElementById("myList");
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
ຄຳວັດ 4
ຈາກສາຍພັກຂອງມັນປົດອອກອຸປະກອນ:
element.parentNode.removeChild(element);
ຄຳວັດ 5
ຈາກສາຍປະກອບຂອງມັນປົດອອກອຸປະກອນຄືນຫຼັງຈາກທີ່ປົດອອກຈາກສາຍປະກອບຂອງມັນ:
const element = document.getElementById("myLI");
function removeLi() {
element.parentNode.removeChild(element);
}
function appendLi() {
const list = document.getElementById("myList");
list.appendChild(element);
}
ຕົວຢ່າງ 6: ການສັນຢູ່
ກະນາດຕິດຕາມ appendChild() ຫລື insertBefore() ເພື່ອກັບຄືນບັນດາບັນດາຄອມໃນບັນດາບັນດາຄອມດຽວກັນ.
ສາມາດນໍາໃຊ້ document.adoptNode() ຫລື document.importNode() ເພື່ອກັບຄືນເປັນຫນຶ່ງຂອງບັນດາບັນດາຄອມອື່ນ.
ນັກຕົວຢ່າງນີ້ຖອນບັນດາບັນດາຄອມຈາກພາວະປົກກະຕິຂອງພວກເຂົາແລະບັນດາບັນດາຄອມທີ່ຈະຖືກກັບຄືນເປັນຫນຶ່ງຂອງບັນດາບັນດາຄອມຂອງບັນດາບັນດາຄອມອື່ນ.
const child = document.getElementById("mySpan");
function remove() {
child.parentNode.removeChild(child);
}
function insert() {
const frame = document.getElementsByTagName("IFRAME")[0]
const h = frame.contentWindow.document.getElementsByTagName("H1")[0];
const x = document.adoptNode(child);
h.appendChild(x);
}
ກົດລະບຽບ
element.removeChild(node)
ຫນຶ່ງຂອງ
node.removeChild(node)
ສະເພາະ
| ສະເພາະ | ການອະທິບາຍ |
|---|---|
| node | ຈຳເປັນ. ລູກຈະຖືກຖອນອອກ (ບັນດາບັນດາຄອມ). |
ຄວາມຜະລິດ
| ການນຳໃຊ້ | ການອະທິບາຍ |
|---|---|
| Node |
ຫນຶ່ງຂອງລູກທີ່ຖືກຖອນອອກ (ບັນດາບັນດາຄອມ). ຖ້າບໍ່ມີຫນຶ່ງຂອງລູກຈະຖືກກັບຄືນເປັນ null. |
ການສະໜັບສະໜູນບັນດາບັນດາຄອມພິວເຕີ້
element.removeChild() ເປັນລັກສະນະ DOM Level 1 (1998) ປະສົມອາຊີບ.
ທຸກບັນດາບັນດາຄອມພິວເຕີ້ທັງໝົດການສະໜັບສະໜູນມັນ:
| Chrome | IE | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| Chrome | IE | Edge | Firefox | Safari | Opera |
| ການສະໜັບສະໜູນ | 9-11 | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ | ການສະໜັບສະໜູນ |
- ຫນ້າທີ່ກ່ອນ removeAttributeNode()
- ຫນ້າທີ່ຕໍ່ໄປ removeEventListener()
- ກັບຄືນຖະໜົນຕໍ່າ ບັນດາວ່າງ HTML DOM Elements
