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

Thuộc tính độ dài DOM HTML

Thuộc tính độ dài DOM HTML trả về một số tương ứng với các nút trong đối tượng danh sách nút.

Cú pháp

Sau đây là cú pháp -

Trả về số lượng nút trong Đối tượng nodeList.

nodeList.length

Ví dụ

Hãy để chúng tôi xem một ví dụ về Độ dài DOM HTML tài sản -

<!DOCTYPE html>
<html>
<head>
<title>HTML DOM length</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
   ul{
      width: 30%;
      margin: 0 auto;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>HTML-DOM-length</legend>
<h3>Students</h3>
<ul>
<li>Adam</li>
<li>Alex</li>
<li>Bina</li>
<li>Eden</li>
<li>Rajesh</li>
<li>Zampa</li>
</ul>
<input type="button" onclick="getStrength()" value="Get Total Students">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var studentList = document.getElementsByTagName("li");
   function getStrength() {
      divDisplay.textContent = 'Total Students: '+studentList.length;
   }
</script>
</body>
</html>

Đầu ra

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

Trước khi nhấp vào ‘Nhận Tổng số sinh viên’ nút -

Thuộc tính độ dài DOM HTML

Sau khi nhấp vào ‘Nhận Tổng số sinh viên’ nút -

Thuộc tính độ dài DOM HTML