การรีเซ็ตสไตล์ผ่าน style ใน JavaScript
สมมติว่าเราตัดสินใจที่จะซ่อนองค์ประกอบ ตามเหตุการณ์บางอย่าง:
elem.style.display = 'none';
สมมติว่าตอนนี้เราตัดสินใจที่จะแสดง
มันอีกครั้ง นั่นหมายความว่า
คุณสมบัติ display
ต้องคืนค่าดั้งเดิมของมัน
ตัวอย่างเช่น:
elem.style.display = 'block';
ปัญหาคือว่ามันไม่สะดวก
เพราะค่าดั้งเดิมไม่จำเป็น
ต้องเป็น block เสมอไป มันอาจจะ
เป็น flex, inline-block,
หรืออย่างอื่นก็ได้ ค่านั้นอาจถูกกำหนดโดยเรา
ในไฟล์ CSS หรืออาจเป็นค่าที่เบราว์เซอร์
ใช้ตามค่าเริ่มต้น การติดตามค่า
ที่ถูกต้องนั้นยุ่งยาก
โชคดีที่มีวิธีง่ายๆ ในการคืนค่า คุณสมบัติสู่ค่าดั้งเดิม เพียงแค่กำหนดค่า คุณสมบัติเป็นสตริงว่าง:
elem.style.display = '';
มี div และปุ่มสองปุ่ม เมื่อคลิกที่ปุ่มแรก ให้ซ่อน div และเมื่อคลิกที่ปุ่มที่สอง - ให้แสดง
มี div และปุ่มสองปุ่ม เมื่อคลิกที่ปุ่มแรก ให้เปลี่ยนสีพื้นหลังของ div เป็นสีแดง และเมื่อคลิกที่ปุ่มที่สอง - ให้คืนค่าสีเดิม