انتخاب همه عنصرهایی (Element) از صفحه که دارای دو یا چند کلاس (Class) خاص می باشند، با روش document.getElementsByClassName ، در JavaScript
در کلید شماره 28212 روش document.getElementsByClassName
در JavaScript را معرفی کردیم و گفتیم که می تواند برای انتخاب همه عنصرهایی (Element) از صفحه که دارای یک کلاس (Class) خاص می باشند، به کار رود. اما document.getElementsByClassName
این قابلیت را هم دارد که عنصرهایی را انتخاب کند که دو یا چند کلاس (Class) خاص را دارند.
به عنوان مثال، فرض کنید بخواهیم همه عنصرهایی (Element) از صفحه را انتخاب کنیم که هم دارای کلاس MyClass1
و هم دارای کلاس MyClass2
باشند، بنابراین کد JavaScript زیر را می نویسیم :
یا فرض کنید بخواهیم همه عنصرهایی (Element) از صفحه را انتخاب کنیم که هم دارای کلاس MyClass1
و هم دارای کلاس MyClass2
و هم دارای کلاس MyClass3
باشند، بنابراین کد JavaScript زیر را می نویسیم :
با اجرای هر کدام از کدهای بالا، عنصرهای انتخاب شده، در یک مجموعه از عنصرها (HTMLCollection) با نام collection
ذخیره می شوند، که بر اساس شماره متناظر با آنها (index) می توانیم به آنها اشاره کنیم.
مثلا برای اشاره به اولین عنصر، عبارت زیر را می نویسیم (شماره های متناظر از 0 شروع می شود، نه از 1) :
و برای برای اشاره به دومین عنصر، عبارت زیر را می نویسیم :
به مثال زیر توجه کنید :
نتیجه :
در این مثال، از حلقه for استفاده کرده ایم تا بتوانیم تغییرات مورد نظرمان را بر روی همه عنصرهای انتخاب شده اعمال کنیم :