คุณสมบัติ HTML DOM designMode ช่วยให้เราสามารถระบุว่าเอกสารทั้งหมดสามารถแก้ไขได้หรือไม่ สิ่งนี้ทำให้เอกสาร HTML ทำหน้าที่เป็นตัวแก้ไข WYSIWYG (สิ่งที่คุณเห็นคือสิ่งที่คุณได้รับ) เนื่องจากเราสามารถแก้ไขเอกสาร HTML ได้ คุณสมบัตินี้ถูกตั้งค่าเริ่มต้นเป็น “ปิด” และโดยการตั้งค่าเป็น “เปิด” เราสามารถแก้ไขเอกสารได้
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
การตั้งค่าคุณสมบัติ designMode -
document.designMode = "on|off"
โดยที่ "ปิด" เป็นค่าเริ่มต้นและตั้งค่าเป็น "เปิด" ทำให้เราแก้ไขเอกสารได้
ตัวอย่าง
ให้เราดูตัวอย่างคุณสมบัติ HTML DOM designMode -
<!DOCTYPE html> <html> <body> <h1>Document designMode Property</h1> <p> This is a paragraph with some text</p> <button type="button">BUTTON1</button> <script> document.designMode="on"; </script> </body> </html>
ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
หลังจากแก้ไขเอกสาร −
ในตัวอย่างข้างต้น −
เราได้สร้างองค์ประกอบ HTML หลายรายการ ตัวอย่างเช่น องค์ประกอบ
,
และองค์ประกอบ
<h1>Document designMode Property</h1> <p> This is a paragraph with some text</p> <button type="button">BUTTON1</button>
จากนั้นเราได้ตั้งค่า document.designMode เป็น “on” ซึ่งช่วยให้เราแก้ไขเอกสาร HTML ได้ ตอนนี้เราเปลี่ยนข้อความและลบองค์ประกอบต่างๆ ได้ด้วยการล้างข้อความ
เช่น:การลบข้อความปุ่ม ปุ่มจะถูกลบออกด้วย
<script> document.designMode="on"; </script>
