متد document.getElementById
مثال (متد document.getElementById)
گرفتن یک عنصر با یک ID مشخص:
خودتان امتحان کنید »
در انتهای این صفحه، مثال های بیشتری آورده شده است.
تعریف و کاربرد
متد getElementById()، عنصر با یک ID مشخص را برمی گرداند.
این متد یکی از متداول ترین متدها در HTML DOM می باشد و هر زمان که بخواهید در سند خود یک عنصر را دستکاری کرده یا اطلاعاتی از آن به دست بیاورید می توانید از آن استفاده کنید.
در صورتی که ID مورد نظر وجود نداشته باشد، null را برمی گرداند.
یک ID در یک صفحه باید منحصر به فرد باشد، در صورتی که بیش از یک عنصر، با یک ID مشخص وجود داشته باشند، متد getElementById()، اولین عنصر در سورس کد را برمی گرداند.
پشتیبانی مرورگرها
اعداد داخل جدول زیر نشان دهنده ی اولین ورژن مرورگری است که به طو کامل از این متد پشتیبانی می کند.
| متد | |||||
|---|---|---|---|---|---|
| getElementById() | 1.0 | 5.5 | 1.0 | 1.0 | 7.0 |
نحوه استفاده
مقادیر پارامترها
| پارامتر | Type | توضیحات |
|---|---|---|
| elementID | String |
ضروری. خصوصیت ID عنصری که شما می خواهید به آن دست یابید. |
جزئیات تکنیکی
| DOM Version: | Core Level 2 کلیه توابع و خصوصیت های شیء Document در JavaScript |
|---|---|
| مقدار برگشتی |
عنصر با ID مورد نظر. در صورتی که هیچ عنصری با ID مورد نظر وجود نداشته باشد null را برمی گرداند. |
مثال - خودتان امتحان کنید
مثال (متد document.getElementById)
به دست آوردن عنصر با "id="demo و تغییر دادن رنگ آن:
x.style.color = "red"; // Change the color of the element
خودتان امتحان کنید »
آموزش های مرتبط
CSS Tutorial: CSS Selectors
CSS Reference: CSS #id Selector
HTML DOM Reference: HTML DOM id Property
HTML DOM Reference: HTML DOM Style Object
کلیه توابع و خصوصیت های شیء Document در JavaScript
- نوشته شده توسط احسان عباسی
- بازدید: 13502
دیدگاه‌ها
در بسیاری از مثال ها این متد استفاده شده اما من نفهمیدم که نحوه استفاده و کار هایی که می تواند بکند چیست ؟
فرض کنید یک عنصر div داریم که می خواهیم با استفاده از جاوا اسکریپت رنگ اون رو عوض کنیم. اول برای این عنصر div یک آی دی در نظر می گیریم:
<div id="e lement" >عنصر شماره 1</div >
حالا در جاوااسکریپت برای اینکه بتوانیم رنگ این عنصر را عوض کنیم، به اصطلاح باید اول عنصر مورد نظر را بگیریم و در یک متغیر ذخیره کنیم و سپس خصوصیاتش را عوض کنیم. دستور getElementById درواقع یک عنصر را با آی دی اش می گیرد و در یک متغیر ذخیره می کند.
به صورت زیر:
var elem=document.g etElementById(" element");
elem.style.backgroundColor="red";
در خط دوم کد بالا، رنگ پس زمینه ی عنصر div را به رنگ قرمز(red) تغییر می دهیم.