English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
مجموعة بيانات Element لـ HTML DOM
appendChild()يهدف هذا الطريقة إلى: إضافة عقدة إلى نهاية قائمة الأطفال للعقدة الأم المحددة.
إذا كان العقدة المحددة للطفل هي مرجع لعقدة موجودة في المستند، يقوم appendChild() بنقلها من موقعها الحالي إلى الموقع الجديد (انظر الأمثلة أدناه).
الاستخدامinsertBefore()يمكن استخدام الطريقة في إدراج عقدة جديدة قبل عقدة مسبقة في قائمة الأطفال للعقدة الأم المحددة.
node.appendChild(node)
var newElem = document.createElement("h3"); // إنشاء عنصر h3 جديد var newContent = document.createTextNode("嗨,你好!"); // إنشاء بعض النصوص newElem.appendChild(newContent); // إضافة عقدة نصية جديدة إلى h3 document.body.appendChild(newElem); // إضافة العنصر الجديد ومحتواه إلى DOMاختبار لرؤية‹/›
ملاحظة:إذا كنت ترغب في إنشاء عنصر يحتوي على نص، تذكر أن تنشئ النص كعقدة نصية ثم أدرجه في العنصر ثم أدرج العنصر في المستند.
دعم جميع المتصفحات لطريقة appendChild() بشكل كامل:
الطريقة | |||||
appendChild() | هو | هو | هو | هو | هو |
الم 参数 | الوصف |
---|---|
النود | العقدة التي سيتم إدراجها في العقدة الأم المحددة (عادةً العقدة) |
القيمة المعدة: | القيمة المعدة هي العقدة المضاف إليها |
---|---|
إصدار DOM: | مستوى DOM 1 |
إنشاء عقدة <p> وإدراجها في عقدة <div>:
var para = document.createElement("p"); // إنشاء عقدة <p> var txt = document.createTextNode("This is a paragraph."); // إنشاء عقدة نصية para.appendChild(txt); // إضافة النص إلى <p> document.getElementById("demo").appendChild(para); // إدراج <p> في <div>اختبار لرؤية‹/›
إنشاء عقدة <p> وإدراجها في نهاية جسم المستند:
var para = document.createElement("p"); // إنشاء عقدة <p> var txt = document.createTextNode("This is a paragraph."); // إنشاء عقدة نصية para.appendChild(txt); // إضافة النص إلى <p> document.body.appendChild(para);// قم بتعديل <p> إلى الجسماختبار لرؤية‹/›
هذا المثال ينتقل عنصرًا من موقعه الحالي إلى موقع جديد:
var elem = document.getElementById("myList2").lastElementChild; document.getElementById("myList1").appendChild(elem);اختبار لرؤية‹/›
مرجع HTML DOMالنودطريقة .hasChildNodes()
مرجع HTML DOMالنودطريقة .insertBefore()
مرجع HTML DOMالنودطريقة .removeChild()
مرجع HTML DOMالنودطريقة .replaceChild()
مرجع HTML DOMطريقة document.createElement()
مرجع HTML DOMطريقة document.createTextNode()
مرجع HTML DOMطريقة document.adoptNode()
مرجع HTML DOMطريقة document.importNode()