سبد (0)

خصوصیت element.className

مثال (خصوصیت element.className)

ست کردن کلاس برای یک عنصر <div> با آی دی myDiv:

document.getElementById("myDIV").className = "mystyle";

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

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

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

خصوصیت className ، نام یک کلاس را دریک عنصر ست کرده یا برمی گرداند(مقدار خصوصیت کلاس عنصر).

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

متد
className	بله	بله	بله	بله	بله

نحوه استفاده

برگرداندن خصوصیت className:

HTMLElementObject.className

ست کردن خصوصیت className:

HTMLElementObject.className=class

Property Values

مقدار	توضیحات
class	نام کلاس یک عنصر را مشخص می کند. برای ایجاد کلاس های چند گانه، آنها را با یک فاصله از یکدیگر جدا کنید. مانند عبارت "test demo".

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

مقدار برگشتی	یک رشته که مشخص کننده ی کلاس مورد نظر است. یک لیست از کلاس ها ی یک عنصر که به وسیله ی فاصله از یکدیگر جدا شده اند.

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

مثال (خصوصیت element.className)

به دست آوردن نام کلاس از اولین عنصر <div> در سند(در صورت وجود):

var x = document.getElementsByTagName("DIV")[0].className;

خروجی x در کد بالا

mystyle

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

مثال (خصوصیت element.className)

مثال هایی دیگر درباره ی اینکه چطور نام کلاس را از یک عنصر به دست بیاوریم:

var x = document.getElementsByClassName("mystyle")[0].className;
var y = document.getElementById("myDIV").className;

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

مثال (خصوصیت element.className)

به دست آوردن نام های کلاس از یک عنصر با کلاس های چند گانه:

<div id="myDIV" class="mystyle test example">I am a DIV element</div>

var x = document.getElementById("myDIV").className;

خروجی x در کد بالا

mystyle text example

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

مثال (خصوصیت element.className)

جایگزین کردن یک نام کلاس موجود با یک کلاس جدید:

<div id="myDIV" class="mystyle">I am a DIV element</div>

document.getElementById("myDIV").className = "newClassName";

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

مثال (خصوصیت element.className)

برای اضافه کردن یک کلاس بدون جایگزین کردن مقادیر موجود، نام کلاس مورد نظر را به یک فاصله اضافه کنید:

document.getElementById("myDIV").className += " anotherClass";

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

مثال (خصوصیت element.className)

در صورتی که یک کلاس "mystyle" با آی دی "myDIV" وجود داشته باشد، اندازه ی فونت آن تغییر می کند:

var x = document.getElementById("myDIV");

if (x.className === "mystyle") {
x.style.fontSize = "30px";
}

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

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

CSS Tutorial: CSS Selectors

CSS Reference: CSS .class Selector

HTML DOM Reference: HTML DOM classList Property

HTML DOM Reference: HTML DOM getElementsByClassName() Method

HTML DOM Reference: HTML DOM Style Object

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

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

برای درج دیدگاه، ابتدا باید وارد بیاموز شوید.

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.

مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی

پرداخت آنلاین - بانک ملت