HTML DOM className Propery

<ธาตุวัตถุ

ตัวอย่าง

ตั้งค่าระดับสำหรับ <div> องค์ประกอบที่มี id = "myDiv":

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

ลองตัวเอง»

เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง

ความหมายและการใช้งาน

ชุดคุณสมบัติ className หรือผลตอบแทนที่ชื่อชั้นขององค์ประกอบ (ค่าของแอตทริบิวต์ระดับองค์ประกอบของ)

เคล็ดลับ: คุณสมบัติคล้ายกับ className เป็น classList คุณสมบัติ

สนับสนุนเบราว์เซอร์

คุณสมบัติ
className	ใช่	ใช่	ใช่	ใช่	ใช่

วากยสัมพันธ์

กลับ className ทรัพย์สิน:

HTMLElementObject .className

ตั้ง className ทรัพย์สิน:

HTMLElementObject .className= class

ค่าทรัพย์สิน

ความคุ้มค่า	ลักษณะ
class	ระบุชื่อชั้นขององค์ประกอบ เพื่อนำไปใช้ในชั้นเรียนหลายแยกพวกเขามีช่องว่างเช่น "test demo"

รายละเอียดทางเทคนิค

กลับค่า:	สตริงที่เป็นตัวแทนของชั้นเรียนหรือรายการพื้นที่ที่แยกของชั้นเรียนขององค์ประกอบ

ตัวอย่างอื่น ๆ

ตัวอย่าง

ได้รับชื่อชั้นแรก <div> องค์ประกอบในเอกสาร (if any) :

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

ผลของ x จะเป็น:

mystyle

ลองตัวเอง»

ตัวอย่าง

ตัวอย่างอื่น ๆ เกี่ยวกับวิธีการที่จะได้รับชื่อชั้นขององค์ประกอบ:

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

ลองตัวเอง»

ตัวอย่าง

ได้รับชื่อชั้นขององค์ประกอบกับการเรียนหลาย:

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

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

ผลของ x จะเป็น:

mystyle text example

ลองตัวเอง»

ตัวอย่าง

เขียนทับชื่อชั้นที่มีอยู่กับหนึ่งใหม่:

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

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

ลองตัวเอง»

ตัวอย่าง

ในการเพิ่มระดับให้องค์ประกอบโดยไม่เขียนทับค่าที่มีอยู่แทรกพื้นที่และชื่อชั้นเรียนใหม่:

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

ลองตัวเอง»

ตัวอย่าง

หากมีระดับของ "mystyle" ในองค์ประกอบที่มี id = "myDiv" การเปลี่ยนขนาดตัวอักษรที่:

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

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

ลองตัวเอง»

ตัวอย่าง

สลับระหว่างชื่อชั้นบนเลื่อนตำแหน่งที่แตกต่างกัน - เมื่อผู้ใช้เลื่อนลง 50 พิกเซลจากด้านบนชื่อชั้น "test" จะถูกเพิ่มองค์ประกอบ (and removed when scrolled up again)

ลองตัวเอง»