วิธีการใช้จาวาสคริปต์เพื่อรับค่าแอตทริบิวต์ css ขององค์ประกอบอย่างแม่นยำ เมื่อจัดการกับคุณสมบัติ CSS ขององค์ประกอบ DOM เรามักจะประสบปัญหา: ค่าคุณสมบัติ CSS ถูกกำหนดไว้บนเพจ แต่จะว่างเปล่าเมื่อได้รับ นี่เป็นเพราะไฟล์สไตล์ชีตหรือข้อมูลสไตล์เริ่มต้น CSS แบบอินไลน์ไม่สามารถสะท้อนได้อย่างน่าเชื่อถือ ในแอตทริบิวต์ style บทความนี้จะแนะนำวิธีการรับค่าแอตทริบิวต์ CSS ขององค์ประกอบที่ระบุอย่างถูกต้อง
จาวาสคริปต์:
ตัวอย่างซอร์สโค้ด
[www.downcodes.com] <script type="text/javascript">
ฟังก์ชั่น getStyle (องค์ประกอบชื่อ)
-
//หากแอตทริบิวต์นี้มีอยู่ใน style[] ก็เพิ่งได้รับการตั้งค่า (และเป็นแอตทริบิวต์ปัจจุบัน)
ถ้า (elem.style[ชื่อ])
-
กลับ elem.style[ชื่อ];
-
// หรือลองใช้วิธี IE
อย่างอื่นถ้า (elem.currentStyle)
-
กลับ elem.currentStyle[ชื่อ];
-
//หรือวิธี W3C ถ้ามี
อย่างอื่นถ้า (document.defaultView && document.defaultView.getComputedStyle)
-
//ใช้วิธีการเขียนกฎสไตล์ "text-Align" แบบดั้งเดิมแทน "textAlign"
ชื่อ = name.replace(/([AZ])/g,"-$1");
ชื่อ = name.toLowerCase();
// รับวัตถุสไตล์และรับค่าของแอตทริบิวต์ (ถ้ามี)
var s = document.defaultView.getComputedStyle(องค์ประกอบ,"");
ส่งคืน s && s.getPropertyValue (ชื่อ);
//มิฉะนั้น คุณจะใช้เบราว์เซอร์อื่น
-
อื่น
-
กลับเป็นโมฆะ;
-
-
</สคริปต์>
