Node.removeChild()

و Node.removeChild()الأسلوب يزيل عقدة الطفل من DOM وإرجاع العقدة التي تمت إزالتها.

var oldChild = العقدة .removeChild ( child ) ؛
أو 
عقدة. إزالة الطفل ( طفل ) ؛

• child هي العقدة الفرعية المراد إزالتها من DOM.
• nodeهي العقدة الأم لـ child.
• oldChildيحمل إشارة إلى العقدة الفرعية التي تمت إزالتها ، أي oldChild === child.

لا تزال العقدة الفرعية التي تمت إزالتها موجودة في الذاكرة ، ولكنها لم تعد جزءًا من DOM. مع عرض أول صيغة ، يمكنك إعادة استخدام العقدة التي تمت إزالتها لاحقًا في التعليمات البرمجية ، عبر oldChildمرجع الكائن.

ومع ذلك ، في النموذج الثاني للبناء ، لا يوجد oldChildمرجع محفوظ ، لذلك بافتراض أن الشفرة الخاصة بك لم تحتفظ بأي مرجع آخر للعقدة في مكان آخر ، فستصبح غير قابلة للاستخدام ولا رجعة فيها على الفور ، وعادة ما يتم حذفها تلقائيًا من الذاكرة بعد وقت قصير.

إذا childلم يكن في الواقع تابع elementللعقدة ، فإن الطريقة تستثني. سيحدث هذا أيضًا إذا childكان في الواقع طفلًا elementفي وقت المكالمة ، ولكن تمت إزالته بواسطة معالج حدث تم استدعاؤه أثناء محاولة إزالة العنصر (على سبيل المثال ، blur.)

تقدم الطريقة استثناءً بطريقتين مختلفتين:

1. If the child was in fact a child of element and so existing on the DOM, but was removed the method throws the following exception:

   Uncaught NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

2. If the child doesn't exist on the DOM of the page, the method throws the following exception:
   
   Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.

Given this HTML:

<div id="top">
  <div id="nested"></div>
</div>

To remove a specified element when knowing its parent node:

let d = document.getElementById("top");
let d_nested = document.getElementById("nested");
let throwawayNode = d.removeChild(d_nested);

To remove a specified element without having to specify its parent node:

let node = document.getElementById("nested");
if (node.parentNode) {
  node.parentNode.removeChild(node);
}

To remove all children from an element:

let element = document.getElementById("top");
while (element.firstChild) {
  element.removeChild(element.firstChild);
}

<!--Sample HTML code-->
<div id="top"> </div>

<script type="text/javascript">
  let top = document.getElementById("top");
  let nested = document.getElementById("nested");

  // Throws Uncaught TypeError
  let garbage = top.removeChild(nested);
</script>

<!--Sample HTML code-->
<div id="top">
  <div id="nested"></div>
</div>

<script type="text/javascript">
  let top = document.getElementById("top");
  let nested = document.getElementById("nested");

  // This first call correctly removes the node
  let garbage = top.removeChild(nested);

  // Throws Uncaught NotFoundError
  garbage = top.removeChild(nested);
</script>

• Node.replaceChild
• Node.parentNode
• ChildNode.remove