طريقة NodeList HTML DOM item()

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

item() يُرجع هذا الطريقة العنصر في الموقع المحدد من NodeList.

هناك طريقتان لاستقبال العنصر في الموقع المحدد:

list.item(الفهرس)

أو

list[الفهرس]

الطريقة الأبسط والأكثر شيوعًا هي [الفهرس].

مثال

مثال 1

الحصول على الفروع للعنصر <body>:

const nodeList = document.body.childNodes;

جرب بنفسك

مثال 2

الحصول على اسم العنصر للعنصر الأول من الفروع:

const list = document.body.childNodes;
let name = list.item(0).nodeName;

جرب بنفسك

مثال 3

النتيجة في هذا المثال متطابقة:

const list = document.body.childNodes;
let name = list[0].nodeName;

جرب بنفسك

مثال 4

الحصول على محتوى HTML للعنصر الـ <p> الأول في المستند:

const list = document.getElementsByTagName("p");
let text = list.item(0).innerHTML;

جرب بنفسك

مثال 5

الحصول على محتوى HTML للعنصر الأول <p> داخل "myDIV":

للمحاكاة: const div = document.getElementById("myDIV");
للمحاكاة: const list = div.getElementsByTagName("p");
للمحاكاة: let text = list[0].innerHTML;

جرب بنفسك

مثال 6

تغيير محتوى HTML للعنصر الأول <p> داخل "myDIV":

للمحاكاة: const div = document.getElementById("myDIV");
للمحاكاة: const list = div.getElementsByTagName("p");
للمحاكاة: let text = list[0].innerHTML = "Paragraph changed";

جرب بنفسك

مثال 7

تغيير لون جميع العناصر التي تحتوي على class="child":

للمحاكاة: const list = document.querySelectorAll(".child");
للمحاكاة: for (let i = 0; i < list.length; i++) {
  list[i].style.color = "red";
}

جرب بنفسك

النص

nodelist.item(الفهرس)

أو يمكن اختصارها إلى:

nodelist[الفهرس]

المتغير

المتغير وصف
الفهرس

مطلوب. فهرس العنصر في القائمة (السحابة).

النقاط تترتيب بناءً على ترتيب ظهورها في المستند.

الفهرس يبدأ من 0.

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

نوع وصف
مفهوم النقطة في الموقع المحدد بالفهرس.
null إذا كان المؤشر خارج نطاق المحدد.

دعم المتصفحات

nodelist.item() هي خاصية مستوى DOM 1 (1998).

جميع المتصفحات الحديثة تدعمها:

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

صفحات مرتبطة

خصائص length

طريقة entries()

طريقة forEach()

طريقة keys()

طريقة values()

مفهوم NodeList

طريقة childNodes()

طريقة querySelectorAll()

طريقة getElementsByName()