طريقة HTML DOM removeChild ()
مثال
قم بإزالة أول <li> عنصر من القائمة:
var list = document.getElementById("myList"); // Get the <ul> element with id="myList"
list.removeChild(list.childNodes[0]); // Remove <ul>'s first child node (index 0)
قبل الإزالة:
- قهوة
- شاي
- لبن
بعد الإزالة:
- شاي
- لبن
المزيد من الأمثلة "جربها بنفسك" أدناه.
التعريف والاستخدام
تزيل طريقة removeChild () عقدة فرعية محددة من العنصر المحدد.
إرجاع العقدة التي تمت إزالتها ككائن عقدة ، أو إرجاع العقدة الفارغة إذا كانت العقدة غير موجودة.
ملاحظة: العقدة الفرعية التي تمت إزالتها لم تعد جزءًا من DOM. ومع ذلك ، مع المرجع الذي تم إرجاعه بواسطة هذه الطريقة ، من الممكن إدراج الطفل الذي تمت إزالته في عنصر في وقت لاحق (راجع "مزيد من الأمثلة").
نصيحة: استخدم طريقة appendChild () أو insertBefore () لإدراج العقدة التي تمت إزالتها في نفس المستند. لإدراجه في مستند آخر ، استخدم طريقة document.adoptNode () أو document.importNode () .
دعم المتصفح
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
بناء الجملة
node.removeChild(node)
قيمه المعامل
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
تفاصيل تقنية
| قيمة الإرجاع: | كائن عقدة ، يمثل العقدة التي تمت إزالتها ، أو فارغ إذا كانت العقدة غير موجودة |
|---|---|
| إصدار DOM | كائن عقدة المستوى 1 الأساسي |
مزيد من الأمثلة
مثال
اكتشف ما إذا كانت القائمة تحتوي على أي عقد فرعية. إذا كان الأمر كذلك ، فقم بإزالة أول عقدة فرعية لها (الفهرس 0):
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// If the <ul> element has any child nodes, remove its first child node
if (list.hasChildNodes()) {
list.removeChild(list.childNodes[0]);
}
قبل الإزالة:
- Coffee
- Tea
- Milk
بعد الإزالة:
- Tea
- Milk
مثال
إزالة كافة العقد الفرعية من القائمة:
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// As long as <ul> has a child node, remove it
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
قبل الإزالة:
- Coffee
- Tea
- Milk
بعد الإزالة:
مثال
قم بإزالة عنصر <li> بالمعرف = "myLI" من عنصره الأصلي (بدون تحديد العقدة الأصلية):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
قبل الإزالة:
- Coffee
- Tea
- Milk
بعد الإزالة:
- Coffee
- Milk
مثال
أزل <li> عنصرًا من العنصر الأصل وأدخله مرة أخرى:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
مثال
قم بإزالة عنصر <span> من العنصر الرئيسي وإدراجه في عنصر <h1> في مستند آخر:
var child = document.getElementById("mySpan");
function removeLi() {
child.parentNode.removeChild(child);
}
function myFunction() {
var frame = document.getElementsByTagName("IFRAME")[0]
var h = frame.contentWindow.document.getElementsByTagName("H1")[0];
var x = document.adoptNode(child);
h.appendChild(x);
}