طريقة NodeList HTML DOM Element getElementsByTagName()

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

getElementsByTagName() تعيد طريقة NodeList العناصر التي تحتوي على اسم العنصر المحدد، كعنصر NodeList.

إشارة:قيمة المعامل "*" يعيد جميع الأبناء للعنصر.

انظر أيضًا:

طريقة getElementsByClassName()

طريقة NodeList

طريقة NodeList

NodeList

NodeList هي مجموعة من العناصر الشبيهة بالقوائم (الأسلاك).

يمكنك الوصول إلى العناصر في القائمة باستخدام المؤشر (السحابة). يبدأ المؤشر من 0.

خصائص الطوليعيد عدد العناصر في القائمة.

مثال

مثال 1

تغيير محتوى HTML للعنصر الأول <li> في القائمة:

const list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("li")[0].innerHTML = "Milk";

}

مثال 2

عدد عناصر <p> في "myDIV":

const element = document.getElementById("myDIV");
const nodes = element.getElementsByTagName("p");
let numb = nodes.length;

}

مثال 3

تغيير حجم الخط للعنصر الثاني <p> في "myDIV":

const element = document.getElementById("myDIV");
element.getElementsByTagName("p")[1].style.fontSize = "24px";

}

مثال 4

تغيير لون الخلفية لكل عناصر <p> في "myDIV":

const div = document.getElementById("myDIV");
const nodes = x.getElementsByTagName("P");
for (let i = 0; i < nodes.length; i++) {
  للدورة
nodes[i].style.backgroundColor = "red";

}

مثال 5

تغيير لون الخلفية لكل عنصر الرابع في "myDIV":

const div = document.getElementById("myDIV");
div.getElementsByTagName("*")[3].style.backgroundColor = "red";

}

مثال 6

استخدام "*" كمعامل، لتغيير لون الخلفية لجميع العناصر في "myDIV":

const div = document.getElementById("myDIV");
const nodes = div.getElementsByTagName("*");
for (let i = 0; i < nodes.length; i++) {
  للدورة
nodes[i].style.backgroundColor = "red";

}

تجربة شخصية

النصelementالمعدل.getElementsByTagName(

)

) الوصف
المعدل tagname

القيمة المطلوبة. اسم العنصر الابن.

النوع الوصف
NodeList

الابن لكل عنصر يحتوي على العلامة المحددة.

يتم ترتيب العناصر بناءً على الترتيب الذي يظهر بهم في المصدر.

تفاصيل التقنية

getElementsByTagName() تستدعي هذه الطريقة جميع أبناء العنصر المحدد، وتعيد مصفوفة تحتوي على عناصر Element (هي في الواقع NodeList) تمثل جميع العناصر في الوثيقة التي تحتوي على اسم العنصر المحدد. يتم ترتيب العناصر في المصفوفة بنفس الترتيب الذي يظهر بهم في ملف المصدر للوثيقة.

الاحتياط

واجهة Documentوقد طريقة getElementsByTagName()، فهي تشبهها، لكنها تستدعي كل ملف وثيقة وليس أبناء العنصر فقط.

لا تخلط بين هذا الطريقة طريقة getElementsByName() من HTMLDocument يخلط بينهما، حيث يعتمد الأخير على قيمة الخاصية name للعنصر لاسترجاع العناصر وليس على الأسماء النصية للعناصر.

دعم المتصفح

جميع المتصفحات يدعمونها element.getElementsByTagName()النقطة

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم الدعم