این آموزش در تاریخ ۱۴۰۱/۰۵/۱۴ آپدیت شده است.
آموزش متد setAttribute در DOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش متد setAttribute در DOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
متد setAttribute در DOM جاوااسکریپت
با استفاده از متد ()setAttribute میتونیم یک صفت بهمراه مقدار رو به یک تگ اضافه نماییم.
برای بدست آوردن مقدار یک صفت میتوان از متد getAttribute استفاده کرد.
| مقدار برگشتی | هیچی |
|---|---|
| نسخه DOM | DOM Level 1 |
Free-Learn
مثال از این متد
در ادامه میتوانید یک مثال از این متد را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : ما یک تگ a ایجاد کردیم ولی خب براش صفت href مشخص نکردیم، میخوایم با استفاده از جاوا اسکریپت صفت href بهمراه مقدار ( آدرس سایت فری لرن ) رو براش مشخص کنیم.
|
1 2 3 4 5 6 7 8 |
<script> function Set(){ var MyLink = document.getElementById("MyLink"); MyLink.setAttribute("href" , "https://free-learn.ir/"); } </script> |
مثال شماره ۲ : میخوایم یک آدرس URL عکس از کاربر بگیریم بعدش همون آدرس رو برای صفت Src از تگ IMG ست کنیم.
|
1 2 3 4 5 6 7 8 9 |
<script> function SetUrl(){ var URL = document.getElementById("URL"); var MyImage = document.getElementById("MyImage"); MyImage.setAttribute("src" , URL.value); } </script> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این متد در جاوااسکریپت پشتیبانی میکنند یا خیر.
| نام متد | Chrome | Firefox | Opera | Safari | Edge |
| ()setAttribute | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این متد در جاوااسکریپت بصورت زیر می باشد.
|
1 |
Element.setAttribute( "Attribute_Name" , "Attribute_Value" ); |
Free-Learn
جدول پارامترها
در جدول زیر میتوانید، پارامترهایی را که میتوان در این متد استفاده کرد مشاهده نمایید.
| مقدار | توضیح |
|---|---|
| Attribute_Name | ضروری – نام صفتی که قراره به تگ اضافه شه |
| Attribute_Value | ضروری – مقدار صفتی که قراره به تگ اضافه شه |
Free-Learn
نکات و توضیحات
- اگه موقع اضافه کردن صفت، خوده صفت از قبل وجود داشته باشه ،دیگه فقط مقدارش اضافه میشه یا هم مقدارش تغییر ( آپدیت ) میشه.
- در مثال های بالا من فقط صفت های src یا href رو باهاش کار کردم ولی خب هرصفتی که داخل زبان HTML معتبر باشه، میشه اینجا ازش استفاده کرد. ( لیست صفت های HTML )
- برای اضافه کردن چندین کلاس بصورت همزمان، باید بین هر یک از کلاس ها یک عدد فاصله قرار داد. مثال :
|
1 |
MyTag.setAttribute( "class" , "Class_1 Class_2 Class_3 ..." ); |
