روش setAttribute() عناصر DOM HTML

تعریف و استفاده

setAttribute() این روش ویژگی مشخص شده را اضافه می‌کند و مقدار مشخص شده را به آن اختصاص می‌دهد.

اگر این ویژگی مشخص شده قبلاً وجود دارد، فقط مقدار را تنظیم یا تغییر دهید.

توجه داشته باشید:عنصر HTMLElement مستند HTML به ویژگی‌های JavaScript برای تمام ویژگی‌های استاندارد HTML نیز اشاره دارد. بنابراین، فقط زمانی باید از این روش استفاده کنید که نیاز به تنظیم ویژگی‌های غیراستاندارد دارید.

لطفاً به: مراجعه کنید

دستورالعمل مرجع:

روش getAttribute()

روش removeAttribute()

روش hasAttribute()

روش hasAttributes()

روش getAttributeNode()

روش setAttributeNode()

روش removeAttributeNode()

آموزش:

خصوصیات HTML

مثال

مثال 1

به عنصر، ویژگی class اضافه کنید:

element.setAttribute("class", "democlass");

قبل از افزودن:

عنصر Element

پس از افزودن:

عنصر Element

آزمایش کنید

مثال 2

عنصر ورودی را به دکمه تبدیل کنید:

myInput.setAttribute("type", "button");

آزمایش کنید

قبل از تغییر:

پس از تغییر:

مثال 3

ویژگی href به عنصر <a> اضافه کنید:

myAnchor.setAttribute("href", "");

آزمایش کنید

قبل از افزودن:

به codew3c.com بروید

پس از افزودن:

به codew3c.com بروید

مثال 4

مقدار ویژگی target را به "_self" تغییر دهید:

if (element.hasAttribute("target")) {      
  element.setAttribute("target", "_self");
}

آزمایش کنید

قوانین

element.setAttribute(name, value)

پارامتر

پارامتر توضیح
name ضروری. نام ویژگی.
value ضروری. مقدار جدید ویژگی.

مقدار بازگشتی

هیچ‌چیزی

تخریب

استثنا توضیح
INVALID_CHARACTER_ERR پارامتر name کاراکترهایی که در نام ویژگی‌های HTML یا XML مجاز به استفاده نیستند.
NO_MODIFICATION_ALLOWED_ERR عنصر فعلی خوانا است و اجازه نمی‌دهد که ویژگی‌های آن تغییر کنند.

توجه داشته باشید

می‌توانید به عنصر یک ویژگی style با ارزش اضافه کنید، اما توصیه نمی‌شود که این کار را انجام دهید، زیرا این کار ممکن است ویژگی‌های دیگر style attribute را پوشش دهد.

لطفاً از ویژگی‌های Style Obiect استفاده کنید:

نقص:

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

مزیت:

element.style.backgroundColor = "red";

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

element.setAttribute() این یک ویژگی DOM Level 1 (1998) است.

همه مرورگرها کاملاً از آن حمایت می‌کنند:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
پشتیبانی 9-11 پشتیبانی پشتیبانی پشتیبانی پشتیبانی