طريقة replaceChild() لمكون DOM HTML

التعريف والاستخدام

replaceChild() استخدام العقدة الجديدة لاستبدال العقدة الابنة.

انظر أيضًا:

طريقة removeChild()

طريقة remove()

طريقة appendChild()

طريقة insertBefore()

خصائص childNodes

خصائص firstChild

خصائص lastChild

خصائص firstElementChild

خصائص lastElementChild

الطرق المتعلقة بالوثائق:

طريقة createElement()

طريقة createTextNode()

مثال

مثال 1

استبدال النص الجديد بنص العنصر <li>:

const newNode = document.createTextNode("Water");
const element = document.getElementById("myList").children[0];
element.replaceChild(newNode, element.childNodes[0]);

list.replaceChild(element, list.childNodes[0]);

  • قبل الاستبدال:
  • Tea
  • Milk

بعد الاستبدال:

  • Water
  • Tea
  • Milk

جرب بنفسك

مثال 2

用新的

  • 元素替换
  • 元素：

    استبدال <li> بال< li> الجديدة:
// إنشاء عنصر <li> جديد:
const element = document.createElement("li");
// إنشاء نود نصي جديد:
const textNode = document.createTextNode("Water");
// إضافة نود نصي إلى العنصر <li>:
element.appendChild(textNode);
// الحصول على العنصر <ul> الذي له id="myList":
const list = document.getElementById("myList");
// استبدل الأولى <li> الجديدة بالعناصر:

    list.replaceChild(element, list.childNodes[0]);

    • قبل الاستبدال:
    • Tea
    • Milk

    بعد الاستبدال:

    • Water
    • Tea
    • Milk

    جرب بنفسك

    • النص

    node.replaceChild(newnode, oldnode)

    المعدلات

    المعدلات الوصف
    newnode مطلوب. النقطة التي سيتم إدراجها.
    oldnode مطلوب. النقطة التي سيتم حذفها.

    القيمة المعدلة

    النوع الوصف
    مثل Node النقطة التي يتم استبدالها.

    دعم المتصفح

    element.replaceChild() هي خاصية DOM Level 1 (1998).

    يدعم جميع المتصفحات بشكل كامل:

    Chrome IE Edge Firefox Safari Opera
    Chrome IE Edge Firefox Safari Opera
    الدعم 9-11 الدعم الدعم الدعم الدعم