Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ ownerDocument ของ HTML DOM

คุณสมบัติ ownerDocument ของ HTML DOM จะคืนค่าออบเจ็กต์ Document ซึ่งแทนเอกสารเจ้าของของโหนด

รูปแบบการใช้งาน (Syntax)

node.ownerDocument

ตัวอย่างการใช้งาน

ตัวอย่างด้านล่างแสดงการใช้งานคุณสมบัติ ownerDocument

<!DOCTYPE html> <html> <head> <style>    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: #ff7f5094;       height:100%;    }    p{       font-weight:700;       font-size:1.2rem;    }    .btn{       background:#0197F6;       border:none;       height:2rem;       border-radius:2px;       width:35%;       margin:2rem auto;       display:block;       color:#fff;       outline:none;       cursor:pointer;    }    .show{       font-size:1.5rem;    } </style> </head> <body> <h1>สาธิตคุณสมบัติ DOM ownerDocument</h1> <p>ปุ่มสีนี้เป็นของใคร?</p> <button onclick="showOwner()" class="btn">ดูเจ้าของ</button> <div class="show"></div> <script>    function showOwner() {       document.querySelector(".show").innerHTML=document.querySelector(".btn").ownerDocument.nodeName    } </script> </body> </html>

ผลลัพธ์

โค้ดด้านบนจะให้ผลลัพธ์ดังนี้

คุณสมบัติ ownerDocument ของ HTML DOM

คลิกที่ปุ่ม "ดูเจ้าของ" เพื่อทำความเข้าใจว่าคุณสมบัติ ownerDocument ทำงานอย่างไร

คุณสมบัติ ownerDocument ของ HTML DOM