Phương pháp HTML DOM normalize ()

Phương thức HTML DOM normalize () loại bỏ các nút văn bản trống và kết hợp các nút văn bản liền kề từ một nút được chỉ định.

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

Đang gọi normalize ()

document.normalize()

Hãy để chúng tôi xem ví dụ về normalize () phương pháp -

Ví dụ

<!DOCTYPE html>
<html>
<head>
<title>HTML DOM normalize()</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
   <form>
      <fieldset>
         <legend>HTML-DOM-normalize( )</legend>
         <input type="text" id="textSelect" placeholder="type here...">
         <input type="button" onclick="makeTextNode()" value="Create Text Node">
         <input type="button" onclick="normalizeDocument()" value="Normalize">
         <div id="appendedNodes">All Text Nodes: </div>
         <div id="divDisplay"></div>
      </fieldset>
   </form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var textSelect = document.getElementById("textSelect");
   var appendedNodesDiv = document.getElementById("appendedNodes");
   divDisplay.textContent = 'Total Text Nodes: '+appendedNodesDiv.childNodes.length;
   function makeTextNode() {
      var textNode = document.createTextNode(textSelect.value);
      appendedNodesDiv.appendChild(textNode);
      if(textSelect.value === '')
         divDisplay.textContent = 'Empty Text Node Created';
      else
         divDisplay.textContent = 'Text Node Created with value: '+textSelect.value;
         divDisplay.textContent += ', Total Text Nodes: '+appendedNodesDiv.childNodes.length;
      }
   function normalizeDocument() {
      appendedNodesDiv.normalize();
      divDisplay.textContent = 'Total Text Nodes: '+appendedNodesDiv.childNodes.length;
   }
</script>
</body>
</html>

Đầu ra

Trước khi nhấp vào bất kỳ nút nào -

Sau khi nhấp vào ‘ Tạo nút văn bản’ nút có đầu vào trống -

Phương pháp HTML DOM normalize ()

Sau khi nhấp vào ‘ Tạo nút văn bản’ nút có đầu vào không trống -

Phương pháp HTML DOM normalize ()

Sau khi nhấp vào ‘Chuẩn hóa’ nút -

Phương pháp HTML DOM normalize ()

Sau khi nhấp vào ‘Chuẩn hóa’ nút -

Phương pháp HTML DOM normalize ()