سبد (0)

متد element.setAttribute

مثال (متد element.setAttribute)

اضافه کردن خصوصیت class با مقدار "democlass" به یک عنصر <h1>:

document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");

قبل از ست کردن خصوصیت:

Hello World

بعد از ست کردن خصوصیت:

Hello World


خودتان امتحان کنید »

در انتهای این صفحه، مثال های بیشتری آورده شده است.

تعریف و کاربرد

متد ()setAttribiute، یک خصوصیت مشخص را به یک عنصر اضافه می کند، و به آن یک مقدار مشخص می دهد.

در صورتی که خصوصیت مورد نظر، از قبل موجود باشد، تنها مقدار آن ست شده یا تغییر می کند.

نکته: اگرچه امکان اضافه کردن خصوصیت استایل مورد نظر به یک عنصر به وسیله ی این متد، امکان پذیر است اما توصیه می شود که از properties of the Style object به جای استایل های درون خطی استفاده کنید، زیرا این، دیگر ویژگی های سی اس اس  را که ممکن است در خصوصیت استایل مشخص شده اند را بازنویسی(overwrite) نخواهد کرد.

Bad:

element.setAttribute("style", "background-color: red;");

Good:

element.style.backgroundColor = "red";

نکته پایانی: می توانید از متد  removeAttribute برای حذف کردن یک خصوصیت از یک عنصر استفاده کنید.

نکته پایانی:در رابطه با این مطلب، متد setAttributeNode را مطالعه فرمایید.

پشتیبانی مرورگرها

اعداد داخل جدول زیر نشان دهنده ی اولین ورژن مرورگری است که به طور کامل از این متد پشتیبانی می کند.

متد     
setAttribute() بله 9.0 بله بله بله

نحوه استفاده

element.setAttribute(attributename,attributevalue)

مقادیر پارامترها

پارامترTypeتوضیحات
attributename String

ضروری. نام خصوصیتی که شما می خواهید آن را اضافه کنید.
attributevalue String

ضروری. مقدار خصوصیتی که شما می خواهید آن را اضافه کنید.

جزئیات تکنیکی

مقدار برگشتی No return value
DOM Version Core Level 1 کلیه توابع و خصوصیت های شیء Element در JavaScript
مثال

مثال - خودتان امتحان کنید

مثال (متد element.setAttribute)

تغییر دادن یک فیلد ورودی(input) به یک دکمه ی input:

document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");

قبل از ست کردن خصوصیت:

بعد از ست کردن خصوصیت:

 

خودتان امتحان کنید »

مثال (متد element.setAttribute)

اضافه کردن یک خصوصیت href با مقدار "www.w3schools" به یک عنصر <a>:

document.getElementById("myAnchor").setAttribute("href", "http://www.w3schools.com");

قبل از ست کردن خصوصیت:

Go to w3schools.com

بعد از ست کردن خصوصیت:

Go to w3schools.com

خودتان امتحان کنید »

مثال (متد element.setAttribute)

فهمیدن اینکه آیا یک عنصر <a> دارای یک خصوصیت target است یا نه. در صورتی که دارای این خصوصیت باشد، مقدار target را به "self_" تغییر می دهیم:

// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor"); 

// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {      
    x.setAttribute("target", "_self");
}

خودتان امتحان کنید »

آموزش های مرتبط

HTML Tutorial: HTML Attributes

HTML DOM Reference: getAttribute() Method

HTML DOM Reference: hasAttribute() Method

HTML DOM Reference: removeAttribute() Method

کلیه توابع و خصوصیت های شیء Element در JavaScript Reference کلیه توابع و خصوصیت های شیء Element در JavaScript

نوشته شده توسط احسان عباسی
بازدید: 7445

در میان شش هزار مطلب آموزشی منتشر شده در بیاموز، جستجو نمایید ...

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین - بانک ملت معرفی بیاموز در شبکه سه