مجموعه‌های HTML DOM

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
پرش به ناوبری پرش به جستجو

Object (به فارسی: شیء) HTMLcollection

متد getElementByTagName() یک شیء HTMLCollection برمی‌گرداند. [۱]

یک شیء HTMLCollection یک لیست آرایه مانند (مجموعه) از عناصر HTML است.

کد زیر تمامی عناصر <p> درون یک سند را انتخاب می‌کند:

مثال

var x = document.getElementsByTagName("p");

به عناصر درون مجموعه (collection) می‌توان به وسیلهٔ شماره اندیس عددی دسترسی پیدا کرد. برای دسترسی به دومین عنصر <p> شما می‌بایست کد زیر را بنویسید:

y = x[1];


مشاهدهٔ نتیجه


نکته: اندیس‌ها از ۰ شروع می‌شوند.

طول HTMLCollection در HTML

ویژگی length تعداد عناصر درون یک HTMLCollection را تعریف می‌کند:

مثال

1var myCollection = document.getElementsByTagName("p");
2document.getElementById("demo").innerHTML = myCollection.length;


مشاهدهٔ نتیجه


توضیح مثال:

  1. مجموعه ای از تمامی عناصر <p> می‌سازد.
  2. طول مجموعه ساخته شده را نمایش می‌دهد.

ویژگی length زمانی کاربردی است که شما می‌خواهید در بین عناصر یک مجموعه یک حلقه ایجاد کنید:

مثال

رنگ پس زمینه تمام عناصر <p> را تغییر می دهد :

1var myCollection = document.getElementsByTagName("p");
2var i;
3for (i = 0; i < myCollection.length; i++) {
4  myCollection[i].style.backgroundColor = "red";
5}


مشاهدهٔ نتیجه


یک HTMLCollection یک آرایه نیست!

یک HTMLCollection شاید شبیه یک آرایه باشد، اما آرایه نیست.

شما می‌توانید به وسیله حلقه درون لیست حرکت کنید و به وسیله یک عدد (همانند آرایه) به عناصر مد نظر خود اشاره کنید.

اما شما نمی‌توانید متدهای آرایه مانند: valueOf(), pop(), push(), join() را برای یک HTMLCollection استفاده کنید.

منابع آموزشی