ปัญหาการอ่านสไตล์ใน JavaScript

ผ่านคุณสมบัติ style สามารถ อ่านได้เพียงสไตล์ที่กำหนด ผ่านแอตทริบิวต์ style เท่านั้น นี่ หมายความว่าสไตล์ที่กำหนดในไฟล์ CSS นั้นไม่สามารถอ่านได้

มาดูตัวอย่างกัน สมมติว่าเรามี องค์ประกอบดังต่อไปนี้:

<div id="elem">
	ข้อความ
</div>

สมมติว่าในไฟล์ CSS ได้กำหนด สไตล์ต่อไปนี้ไว้:

#elem {
	color: red;
}

รับการอ้างอิงไปยังองค์ประกอบไว้ในตัวแปร:

let elem = document.querySelector('#elem');

ลองอ่านค่าสไตล์:

console.log(elem.style.color); // จะแสดงผล ''