คุณสมบัติ cssText
คุณสมบัติ cssText ช่วยให้สามารถกำหนด
CSS สไตล์แบบจำนวนมากในหนึ่งบรรทัดได้ โดย
เนื้อหาทั้งหมดของแอตทริบิวต์ style
จะถูกเขียนทับ
ไวยากรณ์
element.style.cssText = 'property 1: value; property 2: value...'
ตัวอย่าง
ลองกำหนดสไตล์หลายรายการให้กับองค์ประกอบ:
<p id="elem"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 40px;';
ตัวอย่าง
ในตัวอย่างนี้ องค์ประกอบจะมีสไตล์อยู่แล้วในแอตทริบิวต์
style ตั้งแต่ต้น
แต่คุณสมบัติ cssText จะเขียนทับมัน:
<p id="elem" style="background: red;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText = 'color: red; font-size: 20px;';
ตัวอย่าง
เพื่อไม่ให้สไตล์เดิมถูกเขียนทับ สามารถทำได้ดังนี้:
<p id="elem" style="background: green;"></p>
let elem = document.querySelector('#elem');
elem.style.cssText += 'color: red; font-size: 20px;';
ดูเพิ่มเติม
-
เมธอด
getComputedStyle,
ซึ่งรับค่าคุณสมบัติ CSS ขององค์ประกอบ
