การกำหนดสไตล์ให้กับองค์ประกอบผ่านแอตทริบิวต์ style ใน JavaScript
ตอนนี้เรามาเรียนรู้วิธีการเพิ่มสไตล์ CSS
ให้กับองค์ประกอบกัน ซึ่งทำได้โดยการเปลี่ยนแปลงแอตทริบิวต์
style
ตัวอย่างเช่น หากต้องการเปลี่ยนสี จะต้องสร้าง
ลำดับดังนี้: elem.style.color,
และกำหนดค่าเป็นสีที่ต้องการ
มาดูตัวอย่างกัน สมมติว่าเรามีองค์ประกอบดังนี้:
<p id="elem">text</p>
ทำให้องค์ประกอบนี้มีสีแดง:
let elem = document.querySelector('#elem');
elem.style.color = 'red';
มี div และปุ่มอยู่ เมื่อคลิกที่ปุ่ม ให้เพิ่ม ความกว้าง ความสูง และเส้นขอบให้กับ div