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

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

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

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

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

css#elem {
  color: red;
}

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

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

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

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