ออบเจ็กต์ HTML DOM Quote แทนองค์ประกอบ <q> ในเอกสาร HTML
ลองสร้าง q object:
รูปแบบไวยากรณ์ (Syntax)
document.createElement(“Q”);
คุณสมบัติ (Properties)
คุณสมบัติของ quote object มีดังนี้:
| คุณสมบัติ | คำอธิบาย |
|---|---|
| cite | คืนค่าและเปลี่ยนค่าของแอตทริบิวต์ cite ขององค์ประกอบ quote ในเอกสาร HTML |
ตัวอย่าง
ตัวอย่างการใช้งานออบเจ็กต์ HTML DOM Quote:
<!DOCTYPE html> <html> <head> <style> body{ text-align:center; background-color:#fff; color:#0197F6; } h1{ color:#23CE6B; } .drop-down{ width:35%; border:2px solid #fff; font-weight:bold; padding:8px; } .btn{ background-color:#fff; border:1.5px dashed #0197F6; height:2rem; border-radius:2px; width:60%; margin:2rem auto; display:block; color:#0197F6; outline:none; cursor:pointer; } p{ font-size:1.2rem; background-color:#db133a; color:#fff; padding:8px; } </style> </head> <body> <h1>ตัวอย่าง DOM quote Object</h1> <button onclick="createQuote()" class="btn">สร้าง quote object</button> <script> function createQuote() { var qElement = document.createElement("Q"); qElement.innerHTML="WordPress is software designed for everyone, emphasizing accessibility, performance, security, and ease of use. We believe great software should work with minimum set up, so you can focus on sharing your story, product, or services freely. "; qElement.setAttribute("cite","https://wordpress.org/about/"); document.body.appendChild(qElement); } </script> </body> </html>
ผลลัพธ์
โค้ดด้านบนจะให้ผลลัพธ์ดังนี้:
คลิกปุ่ม 「สร้าง quote object」 เพื่อสร้าง quote object:
