أحدث البرامج التعليمية وتطوير الشبكة
 

HTML DOM appendChild() Method

<كائن العنصر

مثال

إلحاق عنصر في القائمة:

var node = document.createElement("LI");                 // Create a <li> node
var textnode = document.createTextNode("Water");         // Create a text node
node.appendChild(textnode);                              // Append the text to <li>
document.getElementById("myList").appendChild(node);     // Append <li> to <ul> with id="myList"

قبل إلحاق:

  • Coffee
  • Tea

بعد إلحاق:

  • Coffee
  • Tea
  • Water
انها محاولة لنفسك »

أكثر "Try it Yourself" الأمثلة أدناه.


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

و appendChild() طريقة بإلحاق عقدة كما الطفل الأخير من عقدة.

نصيحة: إذا كنت تريد إنشاء فقرة جديدة، مع النص، تذكر لإنشاء النص كما عقدة النص الذي إلحاق الفقرة، ثم إلحاق الفقرة للوثيقة.

يمكنك أيضا استخدام هذا الأسلوب لنقل عنصر من عنصر إلى آخر (See "More Examples") .

نصيحة: استخدم insertBefore() طريقة لادخال عقدة تابعة جديدة أمام، القائمة، العقدة المحددة الطفل.


دعم المتصفح

الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل الأسلوب.

طريقة
appendChild() نعم فعلا نعم فعلا نعم فعلا نعم فعلا نعم فعلا

بناء الجملة

node .appendChild( node )

قيم معلمة

معامل اكتب وصف
node Node object مطلوب. الكائن عقدة تريد إلحاق

تفاصيل تقنية

قيمة الإرجاع: كائن عقدة، وهو ما يمثل العقدة إلحاق
صفحة DOM المستوى الأساسي كائن 1 عقدة

أمثلة

مزيد من الأمثلة

مثال

نقل عنصر القائمة من قائمة إلى أخرى:

var node = document.getElementById("myList2").lastChild;
document.getElementById("myList1").appendChild(node);

قبل إلحاق:

  • Coffee
  • Tea
  • Water
  • Milk

بعد إلحاق:

  • Coffee
  • Tea
  • Milk
  • Water
انها محاولة لنفسك »

مثال

إنشاء <p> عنصر وإلحاقها إلى <div> العنصر:

var para = document.createElement("P");                       // Create a <p> node
var t = document.createTextNode("This is a paragraph.");      // Create a text node
para.appendChild(t);                                          // Append the text to <p>
document.getElementById("myDIV").appendChild(para);           // Append <p> to <div> with id="myDIV"
انها محاولة لنفسك »

مثال

إنشاء <p> عنصر مع بعض النصوص وإلحاقها إلى نهاية نص المستند:

var x = document.createElement("P");                        // Create a <p> node
var t = document.createTextNode("This is a paragraph.");    // Create a text node
x.appendChild(t);                                           // Append the text to <p>
document.body.appendChild(x);                               // Append <p> to <body>
انها محاولة لنفسك »

صفحات ذات صلة

HTML DOM إشارة: href="met_node_haschildnodes.html"> element . hasChildNodes() Method href="met_node_haschildnodes.html"> element . hasChildNodes() Method

HTML DOM إشارة: href="met_node_insertbefore.html"> element . insertBefore() Method href="met_node_insertbefore.html"> element . insertBefore() Method

HTML DOM إشارة: href="met_node_removechild.html"> element . removeChild() Method href="met_node_removechild.html"> element . removeChild() Method

HTML DOM إشارة: href="met_node_replacechild.html"> element . replaceChild() Method href="met_node_replacechild.html"> element . replaceChild() Method

HTML DOM إشارة: href="met_document_createelement.html">document. createElement() Method href="met_document_createelement.html">document. createElement() Method

HTML DOM إشارة: href="met_document_createtextnode.html">document. createTextNode() Method href="met_document_createtextnode.html">document. createTextNode() Method

HTML DOM إشارة: href="met_document_adoptnode.html">document. adoptNode() Method href="met_document_adoptnode.html">document. adoptNode() Method

HTML DOM إشارة: href="met_document_importnode.html">document. importNode() Method href="met_document_importnode.html">document. importNode() Method


<كائن العنصر