Computer >> Máy Tính >  >> Lập trình >> HTML

Phương thức HTML DOM hasChildNodes ()

Phương thức HTML DOM hasChildNodes () được sử dụng để kiểm tra xem một phần tử có chứa các nút con hay không. Nó trả về true nếu phần tử có chứa các nút con, ngược lại nó trả về false. Nó sẽ coi bất kỳ khoảng trắng nào là các nút con vì khoảng trắng bên trong nút về cơ bản được coi là các nút văn bản.

Cú pháp

Sau đây là cú pháp cho phương thức hasChildNodes () -

node.hasChildNodes()

Ví dụ

Chúng ta hãy xem một ví dụ cho phương thức hasChildNodes () -

<!DOCTYPE html>
<html>
<head>
<script>
   function checkChild() {
      var div = document.getElementById("DIV1").hasChildNodes();
      document.getElementById("Sample").innerHTML = div;
   }
</script>
</head>
<body>
<h1> hasChildNodes() method example</h1>
<div id="DIV1">
<p>This is a p element inside the div element</p>
<span>This is a span element inside the div element</span>
</div>
<br>
<button onclick="checkChild()">CHECK</button>
<p id="Sample"></p>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Phương thức HTML DOM hasChildNodes ()

Khi nhấp vào nút KIỂM TRA -

Phương thức HTML DOM hasChildNodes ()

Trong ví dụ trên -

Đầu tiên, chúng tôi đã tạo một phần tử

với id “DIV1” và nó chứa một phần tử

và một phần tử bên trong nó -

<div id="DIV1">
<p>This is a p element inside the div element</p>
<span>This is a span element inside the div element</span>
</div>

Sau đó, chúng tôi đã tạo một nút CHECK sẽ thực thi phương thức checkChild () khi người dùng nhấp vào -

<button onclick="checkChild()">CHECK</button>

Phương thức checkChild () sử dụng phương thức getElementById () để lấy phần tử

tương ứng và phương thức hasChildNodes () trên đó. Vì phần tử div có hai phần tử con bên trong nó, do đó nó sẽ trả về true. Điều tương tự được hiển thị trong đoạn có id “Sample” bằng cách sử dụng thuộc tính innerHTML -

function checkChild() {
   var div = document.getElementById("DIV1").hasChildNodes();
   document.getElementById("Sample").innerHTML = div;
}