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

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

Object (به فارسی: شیء) HTMLcollection[ویرایش | ویرایش]

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

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

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

مثال[ویرایش | ویرایش]

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

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

y = x[1];


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


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

طول HTMLCollection در HTML[ویرایش | ویرایش]

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

مثال[ویرایش | ویرایش]

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


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


توضیح مثال:

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

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

مثال[ویرایش | ویرایش]

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

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


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


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

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

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

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

منابع آموزشی[ویرایش]