Thuộc tính parentNode trong HTML DOM

Thuộc tính parentNode của HTML DOM trả về đối tượng nút cha của nút được chỉ định trong tài liệu HTML.

Cú pháp

Cú pháp như sau:

node.parentNode

Ví dụ

Dưới đây là ví dụ về thuộc tính parentNode:

<!DOCTYPE html> <html> <head> <style>    html{       height:100%;    }    body{       text-align:center;       color:#fff;       background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;       height:100%;    }    p{       font-weight:700;       font-size:1.2rem;    }    .drop-down{       width:35%;       border:2px solid #fff;       font-weight:bold;       padding:8px;    }    .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;       font-weight:bold;    } </style> </head> <body> <h1>Demo thuộc tính parentNode của DOM</h1> <p>Chào bạn, hãy chọn môn học yêu thích:</p> <select class='drop-down'> <option>Vật lý</option> <option>Toán học</option> <option>Hóa học</option> <option>Tiếng Anh</option> </select> <button onclick="showParent()" class="btn">Hiển thị phần tử cha của option</button> <div class="show"></div> <script>    function showParent() {       var dropDown = document.querySelector(".drop-down");       var option=dropDown.options[dropDown.selectedIndex];       var msg = document.querySelector(".show");       msg.innerHTML="Phần tử cha của option là " + option.parentNode.nodeName + " phần tử";    } </script> </body> </html>

Kết quả

Đoạn mã trên sẽ cho kết quả như sau:

Nhấn vào nút 「Hiển thị phần tử cha của option」 để lấy phần tử cha của phần tử option.