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