قوائم عقدة HTML DOM
NodeList
NodeList عبارة عن مجموعة (قائمة) تشبه مجموعة من كائنات العقدة.
يمكن الوصول إلى العقد في NodeList بواسطة الفهرس (يبدأ من 0).
عدد العقد في NodeList.
تعد NodeList هي نفسها مجموعة HTMLCollection تقريبًا .
مثال
حدد كافة <p>
العقد في المستند:
const myNodeList = document.querySelectorAll("p");
يمكن الوصول إلى العناصر الموجودة في NodeList بواسطة رقم فهرس.
للوصول إلى العقدة <p> الثانية يمكنك كتابة:
myNodeList[1]
ملاحظة: يبدأ الفهرس من 0.
طول قائمة عقدة HTML DOM
تحدد الخاصية عدد length
العقد في قائمة العقد:
مثال
myNodelist.length
تكون length
الخاصية مفيدة عندما تريد تكرار العقد في قائمة العقد:
مثال
غيّر لون جميع عناصر <p> في قائمة العقد:
const myNodelist = document.querySelectorAll("p");
for (let i = 0; i < myNodelist.length; i++) {
myNodelist[i].style.color = "red";
}
الفرق بين HTMLCollection و NodeList
( HTMLCollection
الفصل السابق) عبارة عن مجموعة من عناصر HTML.
أ NodeList
عبارة عن مجموعة من عقد المستند.
مجموعة NodeList ومجموعة HTML هي نفس الشيء إلى حد كبير.
كل من كائن HTMLCollection وكائن NodeList عبارة عن قائمة (مجموعة) من الكائنات تشبه مصفوفة.
كلاهما لهما خاصية length تحدد عدد العناصر في القائمة (المجموعة).
كلاهما يوفر فهرسًا (0 ، 1 ، 2 ، 3 ، 4 ، ...) للوصول إلى كل عنصر مثل المصفوفة.
يمكن الوصول إلى عناصر مجموعة HTML من خلال الاسم أو المعرف أو رقم الفهرس.
لا يمكن الوصول إلى عناصر NodeList إلا من خلال رقم الفهرس الخاص بهم.
يمكن أن يحتوي كائن NodeList فقط على عقد سمات وعقد نصية.
قائمة العقدة ليست مصفوفة!
قد تبدو قائمة العقد كمصفوفة ، لكنها ليست كذلك.
يمكنك تكرار قائمة العقد والإشارة إلى عقدها مثل المصفوفة.
ومع ذلك ، لا يمكنك استخدام أساليب الصفيف ، مثل valueOf () أو push () أو pop () أو Join () في قائمة العقد.