diff --git a/files/zh-cn/web/api/datatransfer/dropeffect/index.md b/files/zh-cn/web/api/datatransfer/dropeffect/index.md
index a52d8e5cc7553a..00ed1de2211a32 100644
--- a/files/zh-cn/web/api/datatransfer/dropeffect/index.md
+++ b/files/zh-cn/web/api/datatransfer/dropeffect/index.md
@@ -43,10 +43,16 @@ dataTransfer.dropEffect;
 ```html
 <div>
   <p id="source" ondragstart="dragstart_handler(event);" draggable="true">
-    Select this element, drag it to the Drop Zone and then release the selection to move the element.
+    Select this element, drag it to the Drop Zone and then release the selection
+    to move the element.
   </p>
 </div>
-<div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">Drop Zone</div>
+<div
+  id="target"
+  ondrop="drop_handler(event);"
+  ondragover="dragover_handler(event);">
+  Drop Zone
+</div>
 ```
 
 ### CSS
@@ -71,7 +77,12 @@ div {
 
 ```js
 function dragstart_handler(ev) {
-  console.log("dragStart: dropEffect = " + ev.dataTransfer.dropEffect + " ; effectAllowed = " + ev.dataTransfer.effectAllowed);
+  console.log(
+    "dragStart: dropEffect = " +
+      ev.dataTransfer.dropEffect +
+      " ; effectAllowed = " +
+      ev.dataTransfer.effectAllowed,
+  );
 
   // Add this element's id to the drag payload so the drop handler will
   // know which element to add to its tree
@@ -80,7 +91,12 @@ function dragstart_handler(ev) {
 }
 
 function drop_handler(ev) {
-  console.log("drop: dropEffect = " + ev.dataTransfer.dropEffect + " ; effectAllowed = " + ev.dataTransfer.effectAllowed);
+  console.log(
+    "drop: dropEffect = " +
+      ev.dataTransfer.dropEffect +
+      " ; effectAllowed = " +
+      ev.dataTransfer.effectAllowed,
+  );
   ev.preventDefault();
 
   // Get the id of the target and add the moved element to the target's DOM
@@ -89,10 +105,15 @@ function drop_handler(ev) {
 }
 
 function dragover_handler(ev) {
-  console.log("dragOver: dropEffect = " + ev.dataTransfer.dropEffect + " ; effectAllowed = " + ev.dataTransfer.effectAllowed);
+  console.log(
+    "dragOver: dropEffect = " +
+      ev.dataTransfer.dropEffect +
+      " ; effectAllowed = " +
+      ev.dataTransfer.effectAllowed,
+  );
   ev.preventDefault();
   // Set the dropEffect to move
-  ev.dataTransfer.dropEffect = "move"
+  ev.dataTransfer.dropEffect = "move";
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransfer/getdata/index.md b/files/zh-cn/web/api/datatransfer/getdata/index.md
index edfe433fba0a7b..31a6f9b5c33197 100644
--- a/files/zh-cn/web/api/datatransfer/getdata/index.md
+++ b/files/zh-cn/web/api/datatransfer/getdata/index.md
@@ -37,7 +37,9 @@ DOMString dataTransfer.getData(format);
 
 ```html
 <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
-    <span id="drag" draggable="true" ondragstart="drag(event)">drag me to the other box</span>
+  <span id="drag" draggable="true" ondragstart="drag(event)"
+    >drag me to the other box</span
+  >
 </div>
 <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
 ```
@@ -45,11 +47,12 @@ DOMString dataTransfer.getData(format);
 ### CSS
 
 ```css
-#div1, #div2 {
-    width:100px;
-    height:50px;
-    padding:10px;
-    border:1px solid #aaaaaa;
+#div1,
+#div2 {
+  width: 100px;
+  height: 50px;
+  padding: 10px;
+  border: 1px solid #aaaaaa;
 }
 ```
 
@@ -57,20 +60,20 @@ DOMString dataTransfer.getData(format);
 
 ```js
 function allowDrop(allowdropevent) {
-    allowdropevent.target.style.color = 'blue';
-    allowdropevent.preventDefault();
+  allowdropevent.target.style.color = "blue";
+  allowdropevent.preventDefault();
 }
 
 function drag(dragevent) {
-    dragevent.dataTransfer.setData("text", dragevent.target.id);
-    dragevent.target.style.color = 'green';
+  dragevent.dataTransfer.setData("text", dragevent.target.id);
+  dragevent.target.style.color = "green";
 }
 
 function drop(dropevent) {
-    dropevent.preventDefault();
-    var data = dropevent.dataTransfer.getData("text");
-    dropevent.target.appendChild(document.getElementById(data));
-    document.getElementById("drag").style.color = 'black';
+  dropevent.preventDefault();
+  var data = dropevent.dataTransfer.getData("text");
+  dropevent.target.appendChild(document.getElementById(data));
+  document.getElementById("drag").style.color = "black";
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransfer/setdata/index.md b/files/zh-cn/web/api/datatransfer/setdata/index.md
index a10b03c421ee61..9d20aba37a1682 100644
--- a/files/zh-cn/web/api/datatransfer/setdata/index.md
+++ b/files/zh-cn/web/api/datatransfer/setdata/index.md
@@ -35,69 +35,73 @@ void dataTransfer.setData(format, data);
 此示例显示了使用 {{domxref("DataTransfer")}} 对象的 {{domxref("DataTransfer.getData","getData()")}}, {{domxref("DataTransfer.setData","setData()")}} }和{{domxref("DataTransfer.clearData","clearData()")}} 方法。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
-<head>
-    <meta charset="UTF-8">
+  <head>
+    <meta charset="UTF-8" />
     <title>DataTransfer.setData()/.getData()/.clearData()</title>
     <style>
-        div {
-            margin: 0em;
-            padding: 2em;
-        }
-        #source {
-            color: blue;
-            border: 1px solid black;
-        }
-        #target {
-            border: 1px solid black;
-        }
+      div {
+        margin: 0em;
+        padding: 2em;
+      }
+      #source {
+        color: blue;
+        border: 1px solid black;
+      }
+      #target {
+        border: 1px solid black;
+      }
     </style>
-</head>
-<body>
+  </head>
+  <body>
     <section>
-        <h1>
-            <code>DataTransfer.setData()</code> <br>
-            <code>DataTransfer.getData()</code> <br>
-            <code>DataTransfer.clearData()</code>
-        </h1>
-        <div>
-            <p id="source" ondragstart="dragstart_handler(event);" draggable="true">
-                Select this element, drag it to the Drop Zone and then release the selection to move the element.
-            </p>
-        </div>
-        <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">
-            Drop Zone
-        </div>
+      <h1>
+        <code>DataTransfer.setData()</code> <br />
+        <code>DataTransfer.getData()</code> <br />
+        <code>DataTransfer.clearData()</code>
+      </h1>
+      <div>
+        <p id="source" ondragstart="dragstart_handler(event);" draggable="true">
+          Select this element, drag it to the Drop Zone and then release the
+          selection to move the element.
+        </p>
+      </div>
+      <div
+        id="target"
+        ondrop="drop_handler(event);"
+        ondragover="dragover_handler(event);">
+        Drop Zone
+      </div>
     </section>
     <!-- js -->
     <script>
-        function dragstart_handler(ev) {
-            console.log("dragStart");
-            // Change the source element's background color to signify drag has started
-            ev.currentTarget.style.border = "dashed";
-            // Set the drag's format and data. Use the event target's id for the data
-            ev.dataTransfer.setData("text/plain", ev.target.id);
-        }
-
-        function dragover_handler(ev) {
-            console.log("dragOver");
-            // prevent Default event
-            ev.preventDefault();
-        }
-
-        function drop_handler(ev) {
-            console.log("Drop");
-            ev.preventDefault();
-            // Get the data, which is the id of the drop target
-            var data = ev.dataTransfer.getData("text");
-            // appendChild
-            ev.target.appendChild(document.getElementById(data));
-            // Clear the drag data cache (for all formats/types)
-            ev.dataTransfer.clearData();
-        }
+      function dragstart_handler(ev) {
+        console.log("dragStart");
+        // Change the source element's background color to signify drag has started
+        ev.currentTarget.style.border = "dashed";
+        // Set the drag's format and data. Use the event target's id for the data
+        ev.dataTransfer.setData("text/plain", ev.target.id);
+      }
+
+      function dragover_handler(ev) {
+        console.log("dragOver");
+        // prevent Default event
+        ev.preventDefault();
+      }
+
+      function drop_handler(ev) {
+        console.log("Drop");
+        ev.preventDefault();
+        // Get the data, which is the id of the drop target
+        var data = ev.dataTransfer.getData("text");
+        // appendChild
+        ev.target.appendChild(document.getElementById(data));
+        // Clear the drag data cache (for all formats/types)
+        ev.dataTransfer.clearData();
+      }
     </script>
-</body>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/datatransfer/types/index.md b/files/zh-cn/web/api/datatransfer/types/index.md
index 1c17a7248e653d..cd7ff0cecdad87 100644
--- a/files/zh-cn/web/api/datatransfer/types/index.md
+++ b/files/zh-cn/web/api/datatransfer/types/index.md
@@ -24,10 +24,10 @@ dataTransfer.types;
 这个例子展示 `types` 和 {{domxref("DataTransfer.items","items")}} 属性的用法
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <title>Examples of DataTransfer.{types,items} properties</title>
-  <meta content="width=device-width">
+  <meta content="width=device-width" />
   <style>
     div {
       margin: 0em;
@@ -56,13 +56,15 @@ dataTransfer.types;
       ev.target.appendChild(document.getElementById(data));
 
       // Print each format type
-      for (let i=0; i < ev.dataTransfer.types.length; i++) {
+      for (let i = 0; i < ev.dataTransfer.types.length; i++) {
         console.log(`… types[${i}] = ${ev.dataTransfer.types[i]}`);
       }
 
       // Print each item's "kind" and "type"
-      for (let i=0; i < ev.dataTransfer.items.length; i++) {
-        console.log(`… items[${i}].kind = ${ev.dataTransfer.items[i].kind}; type = ${ev.dataTransfer.items[i].type}`);
+      for (let i = 0; i < ev.dataTransfer.items.length; i++) {
+        console.log(
+          `… items[${i}].kind = ${ev.dataTransfer.items[i].kind}; type = ${ev.dataTransfer.items[i].type}`,
+        );
       }
     }
 
@@ -70,16 +72,28 @@ dataTransfer.types;
       console.log("dragOver");
       ev.preventDefault();
       // Set the dropEffect to move
-      ev.dataTransfer.dropEffect = "move"
+      ev.dataTransfer.dropEffect = "move";
     }
   </script>
   <body>
-    <h1>Examples of <code>DataTransfer</code>.{<code>types</code>, <code>items</code>} properties</h1>
+    <h1>
+      Examples of <code>DataTransfer</code>.{<code>types</code>,
+      <code>items</code>} properties
+    </h1>
     <ul>
-      <li id="i1" ondragstart="dragstart_handler(event);" draggable="true">Drag Item 1 to the Drop Zone</li>
-      <li id="i2" ondragstart="dragstart_handler(event);" draggable="true">Drag Item 2 to the Drop Zone</li>
+      <li id="i1" ondragstart="dragstart_handler(event);" draggable="true">
+        Drag Item 1 to the Drop Zone
+      </li>
+      <li id="i2" ondragstart="dragstart_handler(event);" draggable="true">
+        Drag Item 2 to the Drop Zone
+      </li>
     </ul>
-    <div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">Drop Zone</div>
+    <div
+      id="target"
+      ondrop="drop_handler(event);"
+      ondragover="dragover_handler(event);">
+      Drop Zone
+    </div>
   </body>
 </html>
 ```
diff --git a/files/zh-cn/web/api/datatransferitem/getasfile/index.md b/files/zh-cn/web/api/datatransferitem/getasfile/index.md
index 386c9a847ea09f..b37cfad4e82cde 100644
--- a/files/zh-cn/web/api/datatransferitem/getasfile/index.md
+++ b/files/zh-cn/web/api/datatransferitem/getasfile/index.md
@@ -28,31 +28,30 @@ _无。_
 
 ```js
 function drop_handler(ev) {
- console.log("Drop");
- ev.preventDefault();
- var data = event.dataTransfer.items;
- for (var i = 0; i < data.length; i += 1) {
-   if ((data[i].kind == 'string') &&
-       (data[i].type.match('^text/plain'))) {
-     // 遍历拖拽项的内容
-     data[i].getAsString(function (s){
-       ev.target.appendChild(document.getElementById(s));
-     });
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/html'))) {
-     // 拖拽项的数据是 HTML
-     console.log("... Drop: HTML");
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/uri-list'))) {
-     // 拖拽项的数据是 URI
-     console.log("... Drop: URI");
-   } else if ((data[i].kind == 'file') &&
-              (data[i].type.match('^image/'))) {
-     // 拖拽项的数据是一个图片
-     var f = data[i].getAsFile();
-     console.log("... Drop: File ");
-   }
- }
+  console.log("Drop");
+  ev.preventDefault();
+  var data = event.dataTransfer.items;
+  for (var i = 0; i < data.length; i += 1) {
+    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
+      // 遍历拖拽项的内容
+      data[i].getAsString(function (s) {
+        ev.target.appendChild(document.getElementById(s));
+      });
+    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
+      // 拖拽项的数据是 HTML
+      console.log("... Drop: HTML");
+    } else if (
+      data[i].kind == "string" &&
+      data[i].type.match("^text/uri-list")
+    ) {
+      // 拖拽项的数据是 URI
+      console.log("... Drop: URI");
+    } else if (data[i].kind == "file" && data[i].type.match("^image/")) {
+      // 拖拽项的数据是一个图片
+      var f = data[i].getAsFile();
+      console.log("... Drop: File ");
+    }
+  }
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransferitem/getasstring/index.md b/files/zh-cn/web/api/datatransferitem/getasstring/index.md
index 0168b737a92528..0bc89c5238c415 100644
--- a/files/zh-cn/web/api/datatransferitem/getasstring/index.md
+++ b/files/zh-cn/web/api/datatransferitem/getasstring/index.md
@@ -37,31 +37,30 @@ This example shows the use of the `getAsString()` method as an _inline function_
 
 ```js
 function drop_handler(ev) {
- console.log("Drop");
- ev.preventDefault();
- var data = ev.dataTransfer.items;
- for (var i = 0; i < data.length; i += 1) {
-   if ((data[i].kind == 'string') &&
-       (data[i].type.match('^text/plain'))) {
-     // This item is the target node
-     data[i].getAsString(function (s){
-       ev.target.appendChild(document.getElementById(s));
-     });
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/html'))) {
-     // Drag data item is HTML
-     console.log("... Drop: HTML");
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/uri-list'))) {
-     // Drag data item is URI
-     console.log("... Drop: URI");
-   } else if ((data[i].kind == 'file') &&
-              (data[i].type.match('^image/'))) {
-     // Drag data item is an image file
-     var f = data[i].getAsFile();
-     console.log("... Drop: File ");
-   }
- }
+  console.log("Drop");
+  ev.preventDefault();
+  var data = ev.dataTransfer.items;
+  for (var i = 0; i < data.length; i += 1) {
+    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
+      // This item is the target node
+      data[i].getAsString(function (s) {
+        ev.target.appendChild(document.getElementById(s));
+      });
+    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
+      // Drag data item is HTML
+      console.log("... Drop: HTML");
+    } else if (
+      data[i].kind == "string" &&
+      data[i].type.match("^text/uri-list")
+    ) {
+      // Drag data item is URI
+      console.log("... Drop: URI");
+    } else if (data[i].kind == "file" && data[i].type.match("^image/")) {
+      // Drag data item is an image file
+      var f = data[i].getAsFile();
+      console.log("... Drop: File ");
+    }
+  }
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransferitem/kind/index.md b/files/zh-cn/web/api/datatransferitem/kind/index.md
index eb1eae301ccb84..6e5c756967e236 100644
--- a/files/zh-cn/web/api/datatransferitem/kind/index.md
+++ b/files/zh-cn/web/api/datatransferitem/kind/index.md
@@ -28,27 +28,24 @@ var itemKind = DataTransferItem.kind;
 
 ```js
 function drop_handler(ev) {
- console.log("Drop");
- ev.preventDefault();
- var data = event.dataTransfer.items;
- for (var i = 0; i < data.length; i += 1) {
-   if ((data[i].kind == 'string') &&
-       (data[i].type.match('^text/plain'))) {
-     // This item is the target node
-     data[i].getAsString(function (s){
-       ev.target.appendChild(document.getElementById(s));
-     });
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/html'))) {
-     // Drag data item is HTML
-     console.log("... Drop: HTML");
-   } else if ((data[i].kind == 'file') &&
-              (data[i].type.match('^image/'))) {
-     // Drag data item is an image file
-     var f = data[i].getAsFile();
-     console.log("... Drop: File ");
-   }
- }
+  console.log("Drop");
+  ev.preventDefault();
+  var data = event.dataTransfer.items;
+  for (var i = 0; i < data.length; i += 1) {
+    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
+      // This item is the target node
+      data[i].getAsString(function (s) {
+        ev.target.appendChild(document.getElementById(s));
+      });
+    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
+      // Drag data item is HTML
+      console.log("... Drop: HTML");
+    } else if (data[i].kind == "file" && data[i].type.match("^image/")) {
+      // Drag data item is an image file
+      var f = data[i].getAsFile();
+      console.log("... Drop: File ");
+    }
+  }
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransferitem/type/index.md b/files/zh-cn/web/api/datatransferitem/type/index.md
index 5568c0bf1531da..9c0288d81bcb22 100644
--- a/files/zh-cn/web/api/datatransferitem/type/index.md
+++ b/files/zh-cn/web/api/datatransferitem/type/index.md
@@ -25,31 +25,30 @@ dataItem.type;
 
 ```js
 function drop_handler(ev) {
- console.log("Drop");
- ev.preventDefault();
- var data = ev.dataTransfer.items;
- for (var i = 0; i < data.length; i += 1) {
-   if ((data[i].kind == 'string') &&
-       (data[i].type.match('^text/plain'))) {
-     // This item is the target node
-     data[i].getAsString(function (s){
-       ev.target.appendChild(document.getElementById(s));
-     });
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/html'))) {
-     // Drag data item is HTML
-     console.log("... Drop: HTML");
-   } else if ((data[i].kind == 'string') &&
-              (data[i].type.match('^text/uri-list'))) {
-     // Drag data item is URI
-     console.log("... Drop: URI");
-   } else if ((data[i].kind == 'file') &&
-              (data[i].type.match('^image/'))) {
-     // Drag data item is an image file
-     var f = data[i].getAsFile();
-     console.log("... Drop: File ");
-   }
- }
+  console.log("Drop");
+  ev.preventDefault();
+  var data = ev.dataTransfer.items;
+  for (var i = 0; i < data.length; i += 1) {
+    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
+      // This item is the target node
+      data[i].getAsString(function (s) {
+        ev.target.appendChild(document.getElementById(s));
+      });
+    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
+      // Drag data item is HTML
+      console.log("... Drop: HTML");
+    } else if (
+      data[i].kind == "string" &&
+      data[i].type.match("^text/uri-list")
+    ) {
+      // Drag data item is URI
+      console.log("... Drop: URI");
+    } else if (data[i].kind == "file" && data[i].type.match("^image/")) {
+      // Drag data item is an image file
+      var f = data[i].getAsFile();
+      console.log("... Drop: File ");
+    }
+  }
 }
 ```
 
diff --git a/files/zh-cn/web/api/datatransferitem/webkitgetasentry/index.md b/files/zh-cn/web/api/datatransferitem/webkitgetasentry/index.md
index 08ce426596beaa..0e5781578250fa 100644
--- a/files/zh-cn/web/api/datatransferitem/webkitgetasentry/index.md
+++ b/files/zh-cn/web/api/datatransferitem/webkitgetasentry/index.md
@@ -35,15 +35,12 @@ HTML 建立了放置区本身，它是[`<div>`](/zh-CN/docs/Web/HTML/Element/div
 <p>Drag files and/or directories to the box below!</p>
 
 <div id="dropzone">
-  <div id="boxtitle">
-    Drop Files Here
-  </div>
+  <div id="boxtitle">Drop Files Here</div>
 </div>
 
 <h2>Directory tree:</h2>
 
-<ul id="listing">
-</ul>
+<ul id="listing"></ul>
 ```
 
 ### CSS
@@ -66,13 +63,17 @@ HTML 建立了放置区本身，它是[`<div>`](/zh-CN/docs/Web/HTML/Element/div
   vertical-align: middle;
   text-align: center;
   color: black;
-  font: bold 2em "Arial", sans-serif;
+  font:
+    bold 2em "Arial",
+    sans-serif;
   width: 300px;
   height: 100px;
 }
 
 body {
-  font: 14px "Arial", sans-serif;
+  font:
+    14px "Arial",
+    sans-serif;
 }
 ```
 
@@ -91,13 +92,13 @@ function scanFiles(item, container) {
   elem.innerHTML = item.name;
   container.appendChild(elem);
 
- if (item.isDirectory) {
+  if (item.isDirectory) {
     let directoryReader = item.createReader();
     let directoryContainer = document.createElement("ul");
     container.appendChild(directoryContainer);
-    directoryReader.readEntries(function(entries) {
-        entries.forEach(function(entry) {
-          scanFiles(entry, directoryContainer);
+    directoryReader.readEntries(function (entries) {
+      entries.forEach(function (entry) {
+        scanFiles(entry, directoryContainer);
       });
     });
   }
@@ -113,28 +114,36 @@ function scanFiles(item, container) {
 然后是事件处理程序。首先，我们阻止[`dragover`](/zh-CN/docs/Web/Events/dragover)事件由默认处理程序处理，以便我们的 drop 区域可以接收 drop：
 
 ```js
-dropzone.addEventListener("dragover", function(event) {
+dropzone.addEventListener(
+  "dragover",
+  function (event) {
     event.preventDefault();
-}, false);
+  },
+  false,
+);
 ```
 
 当然，关闭所有事件的事件处理程序是事件的处理程序[`drop`](/zh-CN/docs/Web/Events/drop)：
 
 ```js
-dropzone.addEventListener("drop", function(event) {
-  let items = event.dataTransfer.items;
+dropzone.addEventListener(
+  "drop",
+  function (event) {
+    let items = event.dataTransfer.items;
 
-  event.preventDefault();
-  listing.innerHTML = "";
+    event.preventDefault();
+    listing.innerHTML = "";
 
-  for (let i=0; i<items.length; i++) {
-    let item = items[i].webkitGetAsEntry();
+    for (let i = 0; i < items.length; i++) {
+      let item = items[i].webkitGetAsEntry();
 
-    if (item) {
+      if (item) {
         scanFiles(item, listing);
+      }
     }
-  }
-}, false);
+  },
+  false,
+);
 ```
 
 这将获取表示从 `event.dataTransfer.items` 中删除的项目的 {{domxref("DataTransferItem")}} 对象列表。然后我们调用 {{domxref("Event.preventDefault()")}} 来防止事件在完成后被进一步处理。
diff --git a/files/zh-cn/web/api/datatransferitemlist/length/index.md b/files/zh-cn/web/api/datatransferitemlist/length/index.md
index 0c1c044f44a4df..f6d3c1d7b11d2e 100644
--- a/files/zh-cn/web/api/datatransferitemlist/length/index.md
+++ b/files/zh-cn/web/api/datatransferitemlist/length/index.md
@@ -32,7 +32,7 @@ function dragstart_handler(ev) {
   dataList.add(ev.target.id, "text/plain");
   // Add some other items to the drag payload
   dataList.add("<p>... paragraph ...</p>", "text/html");
-  dataList.add("http://www.example.org","text/uri-list");
+  dataList.add("http://www.example.org", "text/uri-list");
 }
 
 function drop_handler(ev) {
@@ -41,19 +41,22 @@ function drop_handler(ev) {
   var data = ev.dataTransfer.items;
   // Loop through the dropped items and log their data
   for (var i = 0; i < data.length; i++) {
-    if ((data[i].kind == 'string') && (data[i].type.match('^text/plain'))) {
+    if (data[i].kind == "string" && data[i].type.match("^text/plain")) {
       // This item is the target node
-      data[i].getAsString(function (s){
+      data[i].getAsString(function (s) {
         ev.target.appendChild(document.getElementById(s));
       });
-    } else if ((data[i].kind == 'string') && (data[i].type.match('^text/html'))) {
+    } else if (data[i].kind == "string" && data[i].type.match("^text/html")) {
       // Drag data item is HTML
-      data[i].getAsString(function (s){
+      data[i].getAsString(function (s) {
         console.log("... Drop: HTML = " + s);
       });
-    } else if ((data[i].kind == 'string') && (data[i].type.match('^text/uri-list'))) {
+    } else if (
+      data[i].kind == "string" &&
+      data[i].type.match("^text/uri-list")
+    ) {
       // Drag data item is URI
-      data[i].getAsString(function (s){
+      data[i].getAsString(function (s) {
         console.log("... Drop: URI = " + s);
       });
     }
@@ -64,7 +67,7 @@ function dragover_handler(ev) {
   console.log("dragOver");
   ev.preventDefault();
   // Set the dropEffect to move
-  ev.dataTransfer.dropEffect = "move"
+  ev.dataTransfer.dropEffect = "move";
 }
 
 function dragend_handler(ev) {
@@ -79,10 +82,21 @@ function dragend_handler(ev) {
 
 ```html
 <div>
-  <p id="source" ondragstart="dragstart_handler(event);" ondragend="dragend_handler(event);" draggable="true">
-     Select this element, drag it to the Drop Zone and then release the selection to move the element.</p>
+  <p
+    id="source"
+    ondragstart="dragstart_handler(event);"
+    ondragend="dragend_handler(event);"
+    draggable="true">
+    Select this element, drag it to the Drop Zone and then release the selection
+    to move the element.
+  </p>
+</div>
+<div
+  id="target"
+  ondrop="drop_handler(event);"
+  ondragover="dragover_handler(event);">
+  Drop Zone
 </div>
-<div id="target" ondrop="drop_handler(event);" ondragover="dragover_handler(event);">Drop Zone</div>
 ```
 
 ### CSS
diff --git a/files/zh-cn/web/api/device_orientation_events/detecting_device_orientation/index.md b/files/zh-cn/web/api/device_orientation_events/detecting_device_orientation/index.md
index 16951e7105554c..b6eb473623d77f 100644
--- a/files/zh-cn/web/api/device_orientation_events/detecting_device_orientation/index.md
+++ b/files/zh-cn/web/api/device_orientation_events/detecting_device_orientation/index.md
@@ -74,17 +74,17 @@ function handleOrientation(orientData) {
 ```css
 .garden {
   position: relative;
-  width : 200px;
+  width: 200px;
   height: 200px;
-  border: 5px solid #CCC;
+  border: 5px solid #ccc;
   border-radius: 10px;
 }
 
 .ball {
   position: absolute;
-  top   : 90px;
-  left  : 90px;
-  width : 20px;
+  top: 90px;
+  left: 90px;
+  width: 20px;
   height: 20px;
   background: green;
   border-radius: 100%;
@@ -94,24 +94,28 @@ function handleOrientation(orientData) {
 现在，如果我们移动设备，球将随之移动：
 
 ```js
-var ball   = document.querySelector('.ball');
-var garden = document.querySelector('.garden');
-var output = document.querySelector('.output');
+var ball = document.querySelector(".ball");
+var garden = document.querySelector(".garden");
+var output = document.querySelector(".output");
 
-var maxX = garden.clientWidth  - ball.clientWidth;
+var maxX = garden.clientWidth - ball.clientWidth;
 var maxY = garden.clientHeight - ball.clientHeight;
 
 function handleOrientation(event) {
-  var x = event.beta;  // In degree in the range [-180,180]
+  var x = event.beta; // In degree in the range [-180,180]
   var y = event.gamma; // In degree in the range [-90,90]
 
-  output.innerHTML  = "beta : " + x + "\n";
+  output.innerHTML = "beta : " + x + "\n";
   output.innerHTML += "gamma: " + y + "\n";
 
   // Because we don't want to have the device upside down
   // We constrain the x value to the range [-90,90]
-  if (x >  90) { x =  90};
-  if (x < -90) { x = -90};
+  if (x > 90) {
+    x = 90;
+  }
+  if (x < -90) {
+    x = -90;
+  }
 
   // To make computation easier we shift the range of
   // x and y to [0,180]
@@ -120,11 +124,11 @@ function handleOrientation(event) {
 
   // 10 is half the size of the ball
   // It center the positioning point to the center of the ball
-  ball.style.top  = (maxX*x/180 - 10) + "px";
-  ball.style.left = (maxY*y/180 - 10) + "px";
+  ball.style.top = (maxX * x) / 180 - 10 + "px";
+  ball.style.left = (maxY * y) / 180 - 10 + "px";
 }
 
-window.addEventListener('deviceorientation', handleOrientation);
+window.addEventListener("deviceorientation", handleOrientation);
 ```
 
 输出结果：
diff --git a/files/zh-cn/web/api/devicemotionevent/index.md b/files/zh-cn/web/api/devicemotionevent/index.md
index 369348e65519e6..feacc4589e1ac5 100644
--- a/files/zh-cn/web/api/devicemotionevent/index.md
+++ b/files/zh-cn/web/api/devicemotionevent/index.md
@@ -28,8 +28,8 @@ slug: Web/API/DeviceMotionEvent
 ## 示例
 
 ```js
-window.addEventListener('devicemotion', function(event) {
-  console.log(event.acceleration.x + ' m/s2');
+window.addEventListener("devicemotion", function (event) {
+  console.log(event.acceleration.x + " m/s2");
 });
 ```
 
diff --git a/files/zh-cn/web/api/deviceorientationevent/index.md b/files/zh-cn/web/api/deviceorientationevent/index.md
index b72ef0dce5be7c..49f03d70cc1dd3 100644
--- a/files/zh-cn/web/api/deviceorientationevent/index.md
+++ b/files/zh-cn/web/api/deviceorientationevent/index.md
@@ -25,8 +25,8 @@ slug: Web/API/DeviceOrientationEvent
 ## 例子
 
 ```js
-window.addEventListener('deviceorientation', function(event) {
-  console.log(event.alpha + ' : ' + event.beta + ' : ' + event.gamma);
+window.addEventListener("deviceorientation", function (event) {
+  console.log(event.alpha + " : " + event.beta + " : " + event.gamma);
 });
 ```
 
diff --git a/files/zh-cn/web/api/document/activeelement/index.md b/files/zh-cn/web/api/document/activeelement/index.md
index 3f17f2908adb81..9f21879b52b672 100644
--- a/files/zh-cn/web/api/document/activeelement/index.md
+++ b/files/zh-cn/web/api/document/activeelement/index.md
@@ -31,8 +31,12 @@ element = DocumentOrShadowRoot.activeElement
 <p>Select some text from one of the text areas below:</p>
 
 <form>
-  <textarea name="ta-example-one" id="ta-example-one" rows="7" cols="40">This is Text Area One. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tincidunt, lorem a porttitor molestie, odio nibh iaculis libero, et accumsan nunc orci eu dui.</textarea>
-  <textarea name="ta-example-two" id="ta-example-two" rows="7" cols="40">This is Text Area Two. Fusce ullamcorper, nisl ac porttitor adipiscing, urna orci egestas libero, ut accumsan orci lacus laoreet diam. Morbi sed euismod diam.</textarea>
+  <textarea name="ta-example-one" id="ta-example-one" rows="7" cols="40">
+This is Text Area One. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tincidunt, lorem a porttitor molestie, odio nibh iaculis libero, et accumsan nunc orci eu dui.</textarea
+  >
+  <textarea name="ta-example-two" id="ta-example-two" rows="7" cols="40">
+This is Text Area Two. Fusce ullamcorper, nisl ac porttitor adipiscing, urna orci egestas libero, ut accumsan orci lacus laoreet diam. Morbi sed euismod diam.</textarea
+  >
 </form>
 
 <p>Active element ID: <b id="output-element"></b></p>
@@ -45,19 +49,20 @@ element = DocumentOrShadowRoot.activeElement
 function onMouseUp(e) {
   const activeTextarea = document.activeElement;
   const selection = activeTextarea.value.substring(
-    activeTextarea.selectionStart, activeTextarea.selectionEnd
+    activeTextarea.selectionStart,
+    activeTextarea.selectionEnd,
   );
 
-  const outputElement = document.getElementById('output-element');
-  const outputText = document.getElementById('output-text');
+  const outputElement = document.getElementById("output-element");
+  const outputText = document.getElementById("output-text");
   outputElement.innerHTML = activeTextarea.id;
   outputText.innerHTML = selection;
 }
 
-const textarea1 = document.getElementById('ta-example-one');
-const textarea2 = document.getElementById('ta-example-two');
-textarea1.addEventListener('mouseup', onMouseUp, false);
-textarea2.addEventListener('mouseup', onMouseUp, false);
+const textarea1 = document.getElementById("ta-example-one");
+const textarea2 = document.getElementById("ta-example-two");
+textarea1.addEventListener("mouseup", onMouseUp, false);
+textarea2.addEventListener("mouseup", onMouseUp, false);
 ```
 
 ### Result
diff --git a/files/zh-cn/web/api/document/adoptnode/index.md b/files/zh-cn/web/api/document/adoptnode/index.md
index 0cfb8466b8bb07..3ff3cdfac507f5 100644
--- a/files/zh-cn/web/api/document/adoptnode/index.md
+++ b/files/zh-cn/web/api/document/adoptnode/index.md
@@ -25,16 +25,16 @@ node = document.adoptNode(externalNode);
 ```js
 // 该函数用来从本文档的第一个 iframe 中获取第一个 element 元素，
 // 并插入到当前文档树中
-function getEle(){
-    var iframe = document.getElementsByTagName("iframe")[0],
-        ele = iframe.contentWindow.document.body.firstElementChild
-        if(ele){
-            document.body.appendChild(document.adoptNode(ele))
-        }else{
-            alert("没有更多元素了")
-        }
+function getEle() {
+  var iframe = document.getElementsByTagName("iframe")[0],
+    ele = iframe.contentWindow.document.body.firstElementChild;
+  if (ele) {
+    document.body.appendChild(document.adoptNode(ele));
+  } else {
+    alert("没有更多元素了");
+  }
 }
-document.getElementById("move").onclick = getEle
+document.getElementById("move").onclick = getEle;
 ```
 
 HTML 文档
@@ -42,27 +42,28 @@ HTML 文档
 ```html
 // index.html
 
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
+  <head>
     <title>index.html</title>
-</head>
-<body>
+  </head>
+  <body>
     <iframe src="iframe.html"></iframe>
     <button id="move">移动元素</button>
-</body>
+  </body>
 </html>
 
 // iframe.html
 
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
+  <head>
     <title>iframe.html</title>
-</head>
-<body>
-    <h1>Hello</h1><h3>My world!</h3>
-</body>
+  </head>
+  <body>
+    <h1>Hello</h1>
+    <h3>My world!</h3>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/anchors/index.md b/files/zh-cn/web/api/document/anchors/index.md
index 0b86848c0fdc0a..d11d9c621050f5 100644
--- a/files/zh-cn/web/api/document/anchors/index.md
+++ b/files/zh-cn/web/api/document/anchors/index.md
@@ -20,9 +20,9 @@ nodeList = document.anchors
 ### 例子
 
 ```js
-if ( document.anchors.length >= 5 ) {
-    dump("dump found too many anchors");
-    window.location = "http://www.google.com";
+if (document.anchors.length >= 5) {
+  dump("dump found too many anchors");
+  window.location = "http://www.google.com";
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/cookie/index.md b/files/zh-cn/web/api/document/cookie/index.md
index ca60b986fc0ac7..2961eab13fc8ff 100644
--- a/files/zh-cn/web/api/document/cookie/index.md
+++ b/files/zh-cn/web/api/document/cookie/index.md
@@ -57,7 +57,10 @@ alert(document.cookie);
 document.cookie = "test1=Hello";
 document.cookie = "test2=World";
 
-var myCookie = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");
+var myCookie = document.cookie.replace(
+  /(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/,
+  "$1",
+);
 
 alert(myCookie);
 // 显示：World
@@ -103,15 +106,31 @@ if (document.cookie.replace(/(?:(?:^|.*;\s*)someCookieName\s*\=\s*([^;]*).*$)|^.
 
 var docCookies = {
   getItem: function (sKey) {
-    return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
+    return (
+      decodeURIComponent(
+        document.cookie.replace(
+          new RegExp(
+            "(?:(?:^|.*;)\\s*" +
+              encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") +
+              "\\s*\\=\\s*([^;]*).*$)|^.*$",
+          ),
+          "$1",
+        ),
+      ) || null
+    );
   },
   setItem: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) {
-    if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; }
+    if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) {
+      return false;
+    }
     var sExpires = "";
     if (vEnd) {
       switch (vEnd.constructor) {
         case Number:
-          sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd;
+          sExpires =
+            vEnd === Infinity
+              ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT"
+              : "; max-age=" + vEnd;
           break;
         case String:
           sExpires = "; expires=" + vEnd;
@@ -121,22 +140,43 @@ var docCookies = {
           break;
       }
     }
-    document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : "");
+    document.cookie =
+      encodeURIComponent(sKey) +
+      "=" +
+      encodeURIComponent(sValue) +
+      sExpires +
+      (sDomain ? "; domain=" + sDomain : "") +
+      (sPath ? "; path=" + sPath : "") +
+      (bSecure ? "; secure" : "");
     return true;
   },
   removeItem: function (sKey, sPath, sDomain) {
-    if (!sKey || !this.hasItem(sKey)) { return false; }
-    document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + ( sDomain ? "; domain=" + sDomain : "") + ( sPath ? "; path=" + sPath : "");
+    if (!sKey || !this.hasItem(sKey)) {
+      return false;
+    }
+    document.cookie =
+      encodeURIComponent(sKey) +
+      "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" +
+      (sDomain ? "; domain=" + sDomain : "") +
+      (sPath ? "; path=" + sPath : "");
     return true;
   },
   hasItem: function (sKey) {
-    return (new RegExp("(?:^|;\\s*)" + encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") + "\\s*\\=")).test(document.cookie);
+    return new RegExp(
+      "(?:^|;\\s*)" +
+        encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") +
+        "\\s*\\=",
+    ).test(document.cookie);
   },
   keys: /* optional method: you can safely remove it! */ function () {
-    var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
-    for (var nIdx = 0; nIdx < aKeys.length; nIdx++) { aKeys[nIdx] = decodeURIComponent(aKeys[nIdx]); }
+    var aKeys = document.cookie
+      .replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "")
+      .split(/\s*(?:\=[^;]*)?;\s*/);
+    for (var nIdx = 0; nIdx < aKeys.length; nIdx++) {
+      aKeys[nIdx] = decodeURIComponent(aKeys[nIdx]);
+    }
     return aKeys;
-  }
+  },
 };
 ```
 
@@ -240,11 +280,20 @@ docCookies.keys()
 
 ```js
 docCookies.setItem("test0", "Hello world!");
-docCookies.setItem("test1", "Unicode test: \u00E0\u00E8\u00EC\u00F2\u00F9", Infinity);
+docCookies.setItem(
+  "test1",
+  "Unicode test: \u00E0\u00E8\u00EC\u00F2\u00F9",
+  Infinity,
+);
 docCookies.setItem("test2", "Hello world!", new Date(2020, 5, 12));
 docCookies.setItem("test3", "Hello world!", new Date(2027, 2, 3), "/blog");
 docCookies.setItem("test4", "Hello world!", "Sun, 06 Nov 2022 21:43:15 GMT");
-docCookies.setItem("test5", "Hello world!", "Tue, 06 Dec 2022 13:11:07 GMT", "/home");
+docCookies.setItem(
+  "test5",
+  "Hello world!",
+  "Tue, 06 Dec 2022 13:11:07 GMT",
+  "/home",
+);
 docCookies.setItem("test6", "Hello world!", 150);
 docCookies.setItem("test7", "Hello world!", 245, "/content");
 docCookies.setItem("test8", "Hello world!", null, null, "example.com");
diff --git a/files/zh-cn/web/api/document/createcdatasection/index.md b/files/zh-cn/web/api/document/createcdatasection/index.md
index 7e42d636320557..d2f5b652bbeee1 100644
--- a/files/zh-cn/web/api/document/createcdatasection/index.md
+++ b/files/zh-cn/web/api/document/createcdatasection/index.md
@@ -19,11 +19,11 @@ var CDATASectionNode = document.createCDATASection(data);
 ## 示例
 
 ```js
-var docu = new DOMParser().parseFromString('<xml></xml>', 'application/xml');
+var docu = new DOMParser().parseFromString("<xml></xml>", "application/xml");
 
-var cdata = docu.createCDATASection('Some <CDATA> data & then some');
+var cdata = docu.createCDATASection("Some <CDATA> data & then some");
 
-docu.getElementsByTagName('xml')[0].appendChild(cdata);
+docu.getElementsByTagName("xml")[0].appendChild(cdata);
 
 alert(new XMLSerializer().serializeToString(docu));
 // Displays: <xml><![CDATA[Some <CDATA> data & then some]]></xml>
diff --git a/files/zh-cn/web/api/document/createdocumentfragment/index.md b/files/zh-cn/web/api/document/createdocumentfragment/index.md
index 3d7280ec3c55ee..f62d9be91809fa 100644
--- a/files/zh-cn/web/api/document/createdocumentfragment/index.md
+++ b/files/zh-cn/web/api/document/createdocumentfragment/index.md
@@ -28,22 +28,20 @@ let fragment = document.createDocumentFragment();
 ### HTML
 
 ```html
-<ul id="ul">
-</ul>
+<ul id="ul"></ul>
 ```
 
 ### JavaScript
 
 ```js
-var element  = document.getElementById('ul'); // assuming ul exists
+var element = document.getElementById("ul"); // assuming ul exists
 var fragment = document.createDocumentFragment();
-var browsers = ['Firefox', 'Chrome', 'Opera',
-    'Safari', 'Internet Explorer'];
+var browsers = ["Firefox", "Chrome", "Opera", "Safari", "Internet Explorer"];
 
-browsers.forEach(function(browser) {
-    var li = document.createElement('li');
-    li.textContent = browser;
-    fragment.appendChild(li);
+browsers.forEach(function (browser) {
+  var li = document.createElement("li");
+  li.textContent = browser;
+  fragment.appendChild(li);
 });
 
 element.appendChild(fragment);
diff --git a/files/zh-cn/web/api/document/createelement/index.md b/files/zh-cn/web/api/document/createelement/index.md
index 9c293381851aa3..f3de938537a1e2 100644
--- a/files/zh-cn/web/api/document/createelement/index.md
+++ b/files/zh-cn/web/api/document/createelement/index.md
@@ -33,14 +33,14 @@ var element = document.createElement(tagName[, options]);
 创建一个新的 `<div>` 并且插入到 ID 为“`div1`”的元素前。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
-  <title>||Working with elements||</title>
-</head>
-<body>
-  <div id="div1">The text above has been created dynamically.</div>
-</body>
+  <head>
+    <title>||Working with elements||</title>
+  </head>
+  <body>
+    <div id="div1">The text above has been created dynamically.</div>
+  </body>
 </html>
 ```
 
@@ -49,7 +49,7 @@ var element = document.createElement(tagName[, options]);
 ```js
 document.body.onload = addElement;
 
-function addElement () {
+function addElement() {
   // 创建一个新的 div 元素
   let newDiv = document.createElement("div");
   // 给它一些内容
@@ -88,7 +88,7 @@ customElements.define('expanding-list', ExpandingList, { extends: "ul" });
 如果我们想以函数的方式创建此元素的实例，则可以使用以下方式调用：
 
 ```js
-let expandingList = document.createElement('ul', { is : 'expanding-list' })
+let expandingList = document.createElement("ul", { is: "expanding-list" });
 ```
 
 新元素将被赋予`is`属性，其值为自定义元素的标签名称。
diff --git a/files/zh-cn/web/api/document/createevent/index.md b/files/zh-cn/web/api/document/createevent/index.md
index 49afab5df7104c..8d33ee6768273d 100644
--- a/files/zh-cn/web/api/document/createevent/index.md
+++ b/files/zh-cn/web/api/document/createevent/index.md
@@ -22,15 +22,19 @@ var event = document.createEvent(type);
 
 ```js
 // 创建事件
-var event = document.createEvent('Event');
+var event = document.createEvent("Event");
 
 // 定义事件名为'build'.
-event.initEvent('build', true, true);
+event.initEvent("build", true, true);
 
 // 监听事件
-elem.addEventListener('build', function (e) {
-  // e.target matches elem
-}, false);
+elem.addEventListener(
+  "build",
+  function (e) {
+    // e.target matches elem
+  },
+  false,
+);
 
 // 触发对象可以是任何元素或其他事件目标
 elem.dispatchEvent(event);
diff --git a/files/zh-cn/web/api/document/createnodeiterator/index.md b/files/zh-cn/web/api/document/createnodeiterator/index.md
index 7cffc62d282c20..38ba27cda7506c 100644
--- a/files/zh-cn/web/api/document/createnodeiterator/index.md
+++ b/files/zh-cn/web/api/document/createnodeiterator/index.md
@@ -21,21 +21,21 @@ const nodeIterator = document.createNodeIterator(root[, whatToShow[, filter]]);
 
   - : 是一个可选的无符号长整型（`unsigned long`），是由节点过滤器（[`NodeFilter`](http://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html#Traversal-NodeFilter)）中的常量属性定义的位掩码。这是筛选特定类型节点的便捷方式。其默认值是 `0xFFFFFFFF` ，代表 `SHOW_ALL` 常量。
 
-    | 常量                                                            | 数字值                            | 描述                                                                                                                                                                                                                                                                                    |
-    | --------------------------------------------------------------- | --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-    | `NodeFilter.SHOW_ALL`                                           | `-1` (即`unsigned long` 的最大值) | 显示所有节点。                                                                                                                                                                                                                                                                          |
-    | `NodeFilter.SHOW_ATTRIBUTE` {{deprecated_inline}}        | `2`                               | 显示 {{ domxref("Attr") }} 特性节点。这仅在创建以{{ domxref("Attr") }} 特性节点为根节点的{{ domxref("TreeWalker") }}时有意义；在这种情况下，这意味着该特性节点会出现在迭代或遍历的第一位。因为特性节点不会是其他节点的子代，遍历文档树时，特性节点不会出现。     |
-    | `NodeFilter.SHOW_CDATA_SECTION` {{deprecated_inline}}    | `8`                               | 显示 {{ domxref("CDATASection") }} 节点。                                                                                                                                                                                                                                    |
-    | `NodeFilter.SHOW_COMMENT`                                       | `128`                             | 显示 {{ domxref("Comment") }} 节点。                                                                                                                                                                                                                                            |
-    | `NodeFilter.SHOW_DOCUMENT`                                      | `256`                             | 显示 {{ domxref("Document") }} 节点。                                                                                                                                                                                                                                            |
-    | `NodeFilter.SHOW_DOCUMENT_FRAGMENT`                             | `1024`                            | 显示 {{ domxref("DocumentFragment") }} 节点。                                                                                                                                                                                                                                |
-    | `NodeFilter.SHOW_DOCUMENT_TYPE`                                 | `512`                             | 显示 {{ domxref("DocumentType") }} 节点。                                                                                                                                                                                                                                    |
-    | `NodeFilter.SHOW_ELEMENT`                                       | `1`                               | 显示 {{ domxref("Element") }} 节点。                                                                                                                                                                                                                                            |
-    | `NodeFilter.SHOW_ENTITY` {{deprecated_inline}}           | `32`                              | 显示 {{ domxref("Entity") }} 节点。这仅在创建以{{ domxref("Entity") }}实体节点为根节点的{{ domxref("TreeWalker") }}时有意义；在这种情况下，这意味着该实体节点会出现在迭代或遍历的第一位。因为实体节点不会是其他节点的子代，遍历文档树时，实体节点不会出现。 |
-    | `NodeFilter.SHOW_ENTITY_REFERENCE` {{deprecated_inline}} | `16`                              | 显示 {{ domxref("EntityReference") }} 节点。                                                                                                                                                                                                                                |
+    | 常量                                                     | 数字值                            | 描述                                                                                                                                                                                                                                                          |
+    | -------------------------------------------------------- | --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+    | `NodeFilter.SHOW_ALL`                                    | `-1` (即`unsigned long` 的最大值) | 显示所有节点。                                                                                                                                                                                                                                                |
+    | `NodeFilter.SHOW_ATTRIBUTE` {{deprecated_inline}}        | `2`                               | 显示 {{ domxref("Attr") }} 特性节点。这仅在创建以{{ domxref("Attr") }} 特性节点为根节点的{{ domxref("TreeWalker") }}时有意义；在这种情况下，这意味着该特性节点会出现在迭代或遍历的第一位。因为特性节点不会是其他节点的子代，遍历文档树时，特性节点不会出现。  |
+    | `NodeFilter.SHOW_CDATA_SECTION` {{deprecated_inline}}    | `8`                               | 显示 {{ domxref("CDATASection") }} 节点。                                                                                                                                                                                                                     |
+    | `NodeFilter.SHOW_COMMENT`                                | `128`                             | 显示 {{ domxref("Comment") }} 节点。                                                                                                                                                                                                                          |
+    | `NodeFilter.SHOW_DOCUMENT`                               | `256`                             | 显示 {{ domxref("Document") }} 节点。                                                                                                                                                                                                                         |
+    | `NodeFilter.SHOW_DOCUMENT_FRAGMENT`                      | `1024`                            | 显示 {{ domxref("DocumentFragment") }} 节点。                                                                                                                                                                                                                 |
+    | `NodeFilter.SHOW_DOCUMENT_TYPE`                          | `512`                             | 显示 {{ domxref("DocumentType") }} 节点。                                                                                                                                                                                                                     |
+    | `NodeFilter.SHOW_ELEMENT`                                | `1`                               | 显示 {{ domxref("Element") }} 节点。                                                                                                                                                                                                                          |
+    | `NodeFilter.SHOW_ENTITY` {{deprecated_inline}}           | `32`                              | 显示 {{ domxref("Entity") }} 节点。这仅在创建以{{ domxref("Entity") }}实体节点为根节点的{{ domxref("TreeWalker") }}时有意义；在这种情况下，这意味着该实体节点会出现在迭代或遍历的第一位。因为实体节点不会是其他节点的子代，遍历文档树时，实体节点不会出现。   |
+    | `NodeFilter.SHOW_ENTITY_REFERENCE` {{deprecated_inline}} | `16`                              | 显示 {{ domxref("EntityReference") }} 节点。                                                                                                                                                                                                                  |
     | `NodeFilter.SHOW_NOTATION` {{deprecated_inline}}         | `2048`                            | 显示 {{ domxref("Entity") }} 节点。这仅在创建以{{ domxref("Notation") }}符号节点为根节点的{{ domxref("TreeWalker") }}时有意义；在这种情况下，这意味着该符号节点会出现在迭代或遍历的第一位。因为符号节点不会是其他节点的子代，遍历文档树时，符号节点不会出现。 |
-    | `NodeFilter.SHOW_PROCESSING_INSTRUCTION`                        | `64`                              | 显示 {{ domxref("ProcessingInstruction") }} 节点。                                                                                                                                                                                                                        |
-    | `NodeFilter.SHOW_TEXT`                                          | `4`                               | 显示 {{ domxref("Text") }} 节点。                                                                                                                                                                                                                                                |
+    | `NodeFilter.SHOW_PROCESSING_INSTRUCTION`                 | `64`                              | 显示 {{ domxref("ProcessingInstruction") }} 节点。                                                                                                                                                                                                            |
+    | `NodeFilter.SHOW_TEXT`                                   | `4`                               | 显示 {{ domxref("Text") }} 节点。                                                                                                                                                                                                                             |
 
 - `filter` {{ optional_inline() }}
   - : 是实现 {{ domxref("NodeFilter") }} 接口的对象; 其 `acceptNode()` 方法会对从根节点开始到子树中的每个节点都调用一次，哪些节点需要进入迭代节点列表等待调用则取决于 whatToShow 参数（也可以使用一个简单的回调函数代替`acceptNode()`）。该方法需要返回下列常量之一： `NodeFilter.FILTER_ACCEPT` ，`NodeFilter.FILTER_REJECT` 或 `NodeFilter.FILTER_SKIP`（见[NodeFilter](/zh-CN/docs/Web/API/NodeFilter)），参见[示例](#示例)。
diff --git a/files/zh-cn/web/api/document/createtextnode/index.md b/files/zh-cn/web/api/document/createtextnode/index.md
index f7832bc2d6c71b..977e34f3e96acb 100644
--- a/files/zh-cn/web/api/document/createtextnode/index.md
+++ b/files/zh-cn/web/api/document/createtextnode/index.md
@@ -19,34 +19,32 @@ var text = document.createTextNode(data);
 ## 示例
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
-<head>
-<title>createTextNode 示例</title>
-</head>
-
-<body>
-  <button value="YES! ">YES! </button>
-  <button value="NO! ">NO! </button>
-  <button value="WE CAN! ">WE CAN! </button>
-
-  <hr />
-
-  <p id="p1">段落的第一行。</p>
-
-  <script>
-  const p1 = document.getElementById("p1"),
-  buttons = document.body.querySelectorAll(":scope > button");
-  function addTextNode(text) {
-    p1.appendChild( document.createTextNode(text) );
-  }
-  buttons.forEach(button =>
-    button.addEventListener("click", () =>
-      addTextNode(button.value)
-    )
-  );
-  </script>
-</body>
+  <head>
+    <title>createTextNode 示例</title>
+  </head>
+
+  <body>
+    <button value="YES! ">YES!</button>
+    <button value="NO! ">NO!</button>
+    <button value="WE CAN! ">WE CAN!</button>
+
+    <hr />
+
+    <p id="p1">段落的第一行。</p>
+
+    <script>
+      const p1 = document.getElementById("p1"),
+        buttons = document.body.querySelectorAll(":scope > button");
+      function addTextNode(text) {
+        p1.appendChild(document.createTextNode(text));
+      }
+      buttons.forEach((button) =>
+        button.addEventListener("click", () => addTextNode(button.value)),
+      );
+    </script>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/createtreewalker/index.md b/files/zh-cn/web/api/document/createtreewalker/index.md
index 99278c4ae5d42c..082b01b7e82d58 100644
--- a/files/zh-cn/web/api/document/createtreewalker/index.md
+++ b/files/zh-cn/web/api/document/createtreewalker/index.md
@@ -23,21 +23,21 @@ createTreeWalker(root, whatToShow, filter)
 
   - : 一个无符号长整型，表示一个整合自 [`NodeFilter`](https://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html#Traversal-NodeFilter) 常量属性的位掩码。这是筛选特定类型节点的便捷方式。默认为 `0xFFFFFFFF`，表示 `SHOW_ALL` 常量。
 
-    | 常量                                                     | 数值                                           | 描述                                                                                                                                                                                                                                                                         |
-    | -------------------------------------------------------- | ---------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-    | `NodeFilter.SHOW_ALL`                                    | `4294967295`（`unsigned long` 类型的最大值）    | 显示所有节点。                                                                                                                                                                                                                                                               |
-    | `NodeFilter.SHOW_ATTRIBUTE` {{deprecated_inline}}        | `2`                                            | 显示属性 {{ domxref("Attr") }} 节点。这只在当以一个根 {{ domxref("Attr") }} 节点为起点节点的{{ domxref("TreeWalker") }} 中才有意义，在这种情况下，这意味着属性节点会出现在迭代或遍历第一次出现的位置。因为属性节点永远不是其他节点的子节点，所以在文档树中的遍历不会出现属性节点。 |
-    | `NodeFilter.SHOW_CDATA_SECTION` {{deprecated_inline}}    | `8`                                            | 显示 CDATA {{domxref("CDATASection")}} 节点。                                                                                                                                                                                                                                |
-    | `NodeFilter.SHOW_COMMENT`                                | `128`                                          | 显示注释 {{domxref("Comment")}} 节点。                                                                                                                                                                                                                                       |
-    | `NodeFilter.SHOW_DOCUMENT`                               | `256`                                          | 显示文档 {{domxref("Document")}} 节点。                                                                                                                                                                                                                                      |
-    | `NodeFilter.SHOW_DOCUMENT_FRAGMENT`                      | `1024`                                         | 显示文档片段 {{domxref("DocumentFragment")}} 节点。                                                                                                                                                                                                                          |
-    | `NodeFilter.SHOW_DOCUMENT_TYPE`                          | `512`                                          | 显示文档类型 {{domxref("DocumentType")}} 节点。                                                                                                                                                                                                                              |
-    | `NodeFilter.SHOW_ELEMENT`                                | `1`                                            | 显示元素 {{domxref("Element")}} 节点。                                                                                                                                                                                                                                       |
-    | `NodeFilter.SHOW_ENTITY` {{deprecated_inline}}           | `32`                                           | 遗留属性，不再可用。                                                                                                                                                                                                                                                         |
-    | `NodeFilter.SHOW_ENTITY_REFERENCE` {{deprecated_inline}} | `16`                                           | 遗留属性，不再可用。                                                                                                                                                                                                                                                         |
-    | `NodeFilter.SHOW_NOTATION` {{deprecated_inline}}         | `2048`                                         | 遗留属性，不再可用。                                                                                                                                                                                                                                                         |
-    | `NodeFilter.SHOW_PROCESSING_INSTRUCTION`                 | `64`                                           | 显示处理指令 {{ domxref("ProcessingInstruction") }} 节点。                                                                                                                                                                                                                   |
-    | `NodeFilter.SHOW_TEXT`                                   | `4`                                            | 显示文字 {{ domxref("Text") }} 节点。                                                                                                                                                                                                                                        |
+    | 常量                                                     | 数值                                         | 描述                                                                                                                                                                                                                                                                               |
+    | -------------------------------------------------------- | -------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+    | `NodeFilter.SHOW_ALL`                                    | `4294967295`（`unsigned long` 类型的最大值） | 显示所有节点。                                                                                                                                                                                                                                                                     |
+    | `NodeFilter.SHOW_ATTRIBUTE` {{deprecated_inline}}        | `2`                                          | 显示属性 {{ domxref("Attr") }} 节点。这只在当以一个根 {{ domxref("Attr") }} 节点为起点节点的{{ domxref("TreeWalker") }} 中才有意义，在这种情况下，这意味着属性节点会出现在迭代或遍历第一次出现的位置。因为属性节点永远不是其他节点的子节点，所以在文档树中的遍历不会出现属性节点。 |
+    | `NodeFilter.SHOW_CDATA_SECTION` {{deprecated_inline}}    | `8`                                          | 显示 CDATA {{domxref("CDATASection")}} 节点。                                                                                                                                                                                                                                      |
+    | `NodeFilter.SHOW_COMMENT`                                | `128`                                        | 显示注释 {{domxref("Comment")}} 节点。                                                                                                                                                                                                                                             |
+    | `NodeFilter.SHOW_DOCUMENT`                               | `256`                                        | 显示文档 {{domxref("Document")}} 节点。                                                                                                                                                                                                                                            |
+    | `NodeFilter.SHOW_DOCUMENT_FRAGMENT`                      | `1024`                                       | 显示文档片段 {{domxref("DocumentFragment")}} 节点。                                                                                                                                                                                                                                |
+    | `NodeFilter.SHOW_DOCUMENT_TYPE`                          | `512`                                        | 显示文档类型 {{domxref("DocumentType")}} 节点。                                                                                                                                                                                                                                    |
+    | `NodeFilter.SHOW_ELEMENT`                                | `1`                                          | 显示元素 {{domxref("Element")}} 节点。                                                                                                                                                                                                                                             |
+    | `NodeFilter.SHOW_ENTITY` {{deprecated_inline}}           | `32`                                         | 遗留属性，不再可用。                                                                                                                                                                                                                                                               |
+    | `NodeFilter.SHOW_ENTITY_REFERENCE` {{deprecated_inline}} | `16`                                         | 遗留属性，不再可用。                                                                                                                                                                                                                                                               |
+    | `NodeFilter.SHOW_NOTATION` {{deprecated_inline}}         | `2048`                                       | 遗留属性，不再可用。                                                                                                                                                                                                                                                               |
+    | `NodeFilter.SHOW_PROCESSING_INSTRUCTION`                 | `64`                                         | 显示处理指令 {{ domxref("ProcessingInstruction") }} 节点。                                                                                                                                                                                                                         |
+    | `NodeFilter.SHOW_TEXT`                                   | `4`                                          | 显示文字 {{ domxref("Text") }} 节点。                                                                                                                                                                                                                                              |
 
 - `filter` {{optional_inline}}
   - : 一个具有 `acceptNode` 方法的 {{domxref("NodeFilter")}} 对象，此方法被 {{domxref("TreeWalker")}} 调用以决定是否接受已通过 `whatToShow` 检查的节点。
@@ -54,13 +54,17 @@ createTreeWalker(root, whatToShow, filter)
 const treeWalker = document.createTreeWalker(
   document.body,
   NodeFilter.SHOW_ELEMENT,
-  { acceptNode(node) { return NodeFilter.FILTER_ACCEPT; } }
+  {
+    acceptNode(node) {
+      return NodeFilter.FILTER_ACCEPT;
+    },
+  },
 );
 
 const nodeList = [];
 let currentNode = treeWalker.currentNode;
 
-while(currentNode) {
+while (currentNode) {
   nodeList.push(currentNode);
   currentNode = treeWalker.nextNode();
 }
diff --git a/files/zh-cn/web/api/document/doctype/index.md b/files/zh-cn/web/api/document/doctype/index.md
index 8949b989a3e401..5dd9c356c22942 100644
--- a/files/zh-cn/web/api/document/doctype/index.md
+++ b/files/zh-cn/web/api/document/doctype/index.md
@@ -19,10 +19,17 @@ doctype = document.doctype;
 var doctypeObj = document.doctype;
 
 console.log(
-  "doctypeObj.name: "           + doctypeObj.name            + "\n" +
-  "doctypeObj.internalSubset: " + doctypeObj.internalSubset  + "\n" +
-  "doctypeObj.publicId: "       + doctypeObj.publicId        + "\n" +
-  "doctypeObj.systemId: "       + doctypeObj.systemId
+  "doctypeObj.name: " +
+    doctypeObj.name +
+    "\n" +
+    "doctypeObj.internalSubset: " +
+    doctypeObj.internalSubset +
+    "\n" +
+    "doctypeObj.publicId: " +
+    doctypeObj.publicId +
+    "\n" +
+    "doctypeObj.systemId: " +
+    doctypeObj.systemId,
 );
 ```
 
diff --git a/files/zh-cn/web/api/document/documentelement/index.md b/files/zh-cn/web/api/document/documentelement/index.md
index 29f9849e29b5a8..14542f6bee19d4 100644
--- a/files/zh-cn/web/api/document/documentelement/index.md
+++ b/files/zh-cn/web/api/document/documentelement/index.md
@@ -21,8 +21,8 @@ const firstTier = rootElement.childNodes;
 
 // firstTier 是由根元素的所有子节点组成的一个 NodeList
 for (let i = 0; i < firstTier.length; i++) {
-   // 使用根节点的每个子节点
-   // 如 firstTier[i]
+  // 使用根节点的每个子节点
+  // 如 firstTier[i]
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/domcontentloaded_event/index.md b/files/zh-cn/web/api/document/domcontentloaded_event/index.md
index 0433cf235e3f6c..497f3f5a0c25fd 100644
--- a/files/zh-cn/web/api/document/domcontentloaded_event/index.md
+++ b/files/zh-cn/web/api/document/domcontentloaded_event/index.md
@@ -1,5 +1,5 @@
 ---
-title: 'Document: DOMContentLoaded 事件'
+title: "Document: DOMContentLoaded 事件"
 slug: Web/API/Document/DOMContentLoaded_event
 ---
 
@@ -37,8 +37,8 @@ JavaScript 的同步模式会导致 DOM 解析暂停。如果你想在用户请
 ### 基本用法
 
 ```js
-document.addEventListener('DOMContentLoaded', (event) => {
-    console.log('DOM fully loaded and parsed'); // 译者注："DOM 完全加载以及解析"
+document.addEventListener("DOMContentLoaded", (event) => {
+  console.log("DOM fully loaded and parsed"); // 译者注："DOM 完全加载以及解析"
 });
 ```
 
@@ -46,13 +46,12 @@ document.addEventListener('DOMContentLoaded', (event) => {
 
 ```html
 <script>
-  document.addEventListener('DOMContentLoaded', (event) => {
-    console.log('DOM fully loaded and parsed');
+  document.addEventListener("DOMContentLoaded", (event) => {
+    console.log("DOM fully loaded and parsed");
   });
 
-for( let i = 0; i < 1000000000; i++)
-{} // 这段同步脚本将会延迟 DOM 解析，
-   // 所以 DOMContentLoaded 事件将会延迟执行。
+  for (let i = 0; i < 1000000000; i++) {} // 这段同步脚本将会延迟 DOM 解析，
+  // 所以 DOMContentLoaded 事件将会延迟执行。
 </script>
 ```
 
@@ -62,12 +61,14 @@ for( let i = 0; i < 1000000000; i++)
 
 ```js
 function doSomething() {
-  console.info('DOM loaded');
+  console.info("DOM loaded");
 }
 
-if (document.readyState === 'loading') {  // 此时加载尚未完成
-  document.addEventListener('DOMContentLoaded', doSomething);
-} else {  // 此时`DOMContentLoaded` 已经被触发
+if (document.readyState === "loading") {
+  // 此时加载尚未完成
+  document.addEventListener("DOMContentLoaded", doSomething);
+} else {
+  // 此时`DOMContentLoaded` 已经被触发
   doSomething();
 }
 ```
@@ -108,7 +109,8 @@ body {
   resize: none;
 }
 
-label, button {
+label,
+button {
   display: block;
 }
 
@@ -120,26 +122,26 @@ label, button {
 #### JS
 
 ```js
-const log = document.querySelector('.event-log-contents');
-const reload = document.querySelector('#reload');
+const log = document.querySelector(".event-log-contents");
+const reload = document.querySelector("#reload");
 
-reload.addEventListener('click', () => {
-  log.textContent ='';
+reload.addEventListener("click", () => {
+  log.textContent = "";
   window.setTimeout(() => {
-      window.location.reload(true);
+    window.location.reload(true);
   }, 200);
 });
 
-window.addEventListener('load', (event) => {
-    log.textContent = log.textContent + 'load\n';
+window.addEventListener("load", (event) => {
+  log.textContent = log.textContent + "load\n";
 });
 
-document.addEventListener('readystatechange', (event) => {
-    log.textContent = log.textContent + `readystate: ${document.readyState}\n`;
+document.addEventListener("readystatechange", (event) => {
+  log.textContent = log.textContent + `readystate: ${document.readyState}\n`;
 });
 
-document.addEventListener('DOMContentLoaded', (event) => {
-    log.textContent = log.textContent + `DOMContentLoaded\n`;
+document.addEventListener("DOMContentLoaded", (event) => {
+  log.textContent = log.textContent + `DOMContentLoaded\n`;
 });
 ```
 
diff --git a/files/zh-cn/web/api/document/elementfrompoint/index.md b/files/zh-cn/web/api/document/elementfrompoint/index.md
index 457f8c95c75e8d..db6aacf1222a64 100644
--- a/files/zh-cn/web/api/document/elementfrompoint/index.md
+++ b/files/zh-cn/web/api/document/elementfrompoint/index.md
@@ -33,24 +33,24 @@ var element = document.elementFromPoint(x, y);
 ## 示例
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-<title>elementFromPoint example</title>
-
-<script>
-function changeColor(newColor) {
-  elem = document.elementFromPoint(2, 2);
-  elem.style.color = newColor;
-}
-</script>
-</head>
-
-<body>
-<p id="para1">Some text here</p>
-<button onclick="changeColor('blue');">blue</button>
-<button onclick="changeColor('red');">red</button>
-</body>
+  <head>
+    <title>elementFromPoint example</title>
+
+    <script>
+      function changeColor(newColor) {
+        elem = document.elementFromPoint(2, 2);
+        elem.style.color = newColor;
+      }
+    </script>
+  </head>
+
+  <body>
+    <p id="para1">Some text here</p>
+    <button onclick="changeColor('blue');">blue</button>
+    <button onclick="changeColor('red');">red</button>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/evaluate/index.md b/files/zh-cn/web/api/document/evaluate/index.md
index 6772d5689dc54e..5aea34c4e05bbf 100644
--- a/files/zh-cn/web/api/document/evaluate/index.md
+++ b/files/zh-cn/web/api/document/evaluate/index.md
@@ -28,7 +28,13 @@ var xpathResult = document.evaluate(
 ## 示例
 
 ```js
-var headings = document.evaluate("/html/body//h2", document, null, XPathResult.ANY_TYPE, null);
+var headings = document.evaluate(
+  "/html/body//h2",
+  document,
+  null,
+  XPathResult.ANY_TYPE,
+  null,
+);
 /* 在 document 中查找所有的 h2 元素。
  * 结果可能是无序节点迭代器。 */
 var thisHeading = headings.iterateNext();
diff --git a/files/zh-cn/web/api/document/exitfullscreen/index.md b/files/zh-cn/web/api/document/exitfullscreen/index.md
index 17f8a56f4e70ab..c84ec5edd4c18b 100644
--- a/files/zh-cn/web/api/document/exitfullscreen/index.md
+++ b/files/zh-cn/web/api/document/exitfullscreen/index.md
@@ -21,9 +21,9 @@ document.exitFullscreen();
 // 点击切换全屏模式
 document.onclick = function (event) {
   if (document.fullscreenElement) {
-    document.exitFullscreen()
+    document.exitFullscreen();
   } else {
-    document.documentElement.requestFullscreen()
+    document.documentElement.requestFullscreen();
   }
 };
 ```
diff --git a/files/zh-cn/web/api/document/exitpictureinpicture/index.md b/files/zh-cn/web/api/document/exitpictureinpicture/index.md
index 7d3ef4a2e5f807..a084e7732e5b3e 100644
--- a/files/zh-cn/web/api/document/exitpictureinpicture/index.md
+++ b/files/zh-cn/web/api/document/exitpictureinpicture/index.md
@@ -9,7 +9,7 @@ slug: Web/API/Document/exitPictureInPicture
 
 ## 语法
 
-```js
+```js-nolint
 exitPictureInPicture()
 ```
 
@@ -28,13 +28,14 @@ exitPictureInPicture()
 ```js
 document.onclick = function (event) {
   if (document.pictureInPictureElement) {
-    document.exitPictureInPicture()
+    document
+      .exitPictureInPicture()
       .then(() => console.log("Document Exited from Picture-in-Picture mode"))
-      .catch((err) => console.error(err))
+      .catch((err) => console.error(err));
   } else {
     video.requestPictureInPicture();
   }
-}
+};
 ```
 
 注意，如果你想要跟踪页面上正在以画中画模式播放的视频，你应该在 {{DOMxRef("HTMLVideoElement")}} 元素上监听 `enterpictureinpicture` 和 `exitpictureinpicture` 事件。或者，你可以检查 {{DOMxRef("Document.pictureInPictureElement")}} 元素是否引用了当前的 {{DOMxRef("HTMLVideoElement")}} 元素。
diff --git a/files/zh-cn/web/api/document/fonts/index.md b/files/zh-cn/web/api/document/fonts/index.md
index dc2b0a777dd148..71e909c8aa97c9 100644
--- a/files/zh-cn/web/api/document/fonts/index.md
+++ b/files/zh-cn/web/api/document/fonts/index.md
@@ -20,7 +20,7 @@ let fontFaceSet = document.fonts;
 ### 在所有字体加载完成后进行操作
 
 ```js
-document.fonts.ready.then(function() {
+document.fonts.ready.then(function () {
   // 字体加载完成后的逻辑
 });
 ```
diff --git a/files/zh-cn/web/api/document/forms/index.md b/files/zh-cn/web/api/document/forms/index.md
index 9a598836f6a612..916828bcebf865 100644
--- a/files/zh-cn/web/api/document/forms/index.md
+++ b/files/zh-cn/web/api/document/forms/index.md
@@ -17,28 +17,32 @@ let collection = document.forms;
 
 ```html
 <html>
-
-<head>
-<title> document.forms example</title>
-</head>
-
-<body>
-<form id="robby">
- <input type="button" onclick="alert(document.forms[0].id);"
- value="robby's form" />
-</form>
-
-<form id="dave">
- <input type="button" onclick="alert(document.forms[1].id);"
- value="dave's form" />
-</form>
-
-<form id="paul">
- <input type="button" onclick="alert(document.forms[2].id);"
- value="paul's form" />
-</form>
-
-</body>
+  <head>
+    <title>document.forms example</title>
+  </head>
+
+  <body>
+    <form id="robby">
+      <input
+        type="button"
+        onclick="alert(document.forms[0].id);"
+        value="robby's form" />
+    </form>
+
+    <form id="dave">
+      <input
+        type="button"
+        onclick="alert(document.forms[1].id);"
+        value="dave's form" />
+    </form>
+
+    <form id="paul">
+      <input
+        type="button"
+        onclick="alert(document.forms[2].id);"
+        value="paul's form" />
+    </form>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/fullscreen/index.md b/files/zh-cn/web/api/document/fullscreen/index.md
index 249aa7a6ee660f..d93ab501d8797c 100644
--- a/files/zh-cn/web/api/document/fullscreen/index.md
+++ b/files/zh-cn/web/api/document/fullscreen/index.md
@@ -26,8 +26,10 @@ var isFullScreen = document.mozFullScreen || document.webkitIsFullScreen;
 ```js
 function isDocumentInFullScreenMode() {
   // 过去由 F11 触发的那种浏览器全屏模式和 HTML5 中内容的全屏模式是不一样的
-  return (document.fullscreenElement && document.fullscreenElement !== null) ||
-      (!document.mozFullScreen && !document.webkitIsFullScreen);
+  return (
+    (document.fullscreenElement && document.fullscreenElement !== null) ||
+    (!document.mozFullScreen && !document.webkitIsFullScreen)
+  );
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/fullscreenchange_event/index.md b/files/zh-cn/web/api/document/fullscreenchange_event/index.md
index 48842363f8db2a..f2a411d1aecb36 100644
--- a/files/zh-cn/web/api/document/fullscreenchange_event/index.md
+++ b/files/zh-cn/web/api/document/fullscreenchange_event/index.md
@@ -53,7 +53,7 @@ function fullscreenchanged(event) {
   // 如果有元素处于全屏模式，则 document.fullscreenElement 将指向该元素。如果没有元素处于全屏模式，则该属性的值为 null。
   if (document.fullscreenElement) {
     console.log(
-      `Element: ${document.fullscreenElement.id} entered fullscreen mode.`
+      `Element: ${document.fullscreenElement.id} entered fullscreen mode.`,
     );
   } else {
     console.log("Leaving fullscreen mode.");
diff --git a/files/zh-cn/web/api/document/fullscreenerror_event/index.md b/files/zh-cn/web/api/document/fullscreenerror_event/index.md
index 72e9aec829cf55..0af2b39c325e63 100644
--- a/files/zh-cn/web/api/document/fullscreenerror_event/index.md
+++ b/files/zh-cn/web/api/document/fullscreenerror_event/index.md
@@ -16,8 +16,8 @@ targetDocument.onfullscreenerror = fullscreenErrorHandler;
 ## 示例
 
 ```js
-document.onfullscreenerror = function ( event ) {
-  console.log("FULL SCREEN DENIED")
+document.onfullscreenerror = function (event) {
+  console.log("FULL SCREEN DENIED");
 };
 
 // requestFullscreen() 将会失败，因为它在事件处理器之外
diff --git a/files/zh-cn/web/api/document/getelementbyid/index.md b/files/zh-cn/web/api/document/getelementbyid/index.md
index 0f281fcb73a132..964252a01d1273 100644
--- a/files/zh-cn/web/api/document/getelementbyid/index.md
+++ b/files/zh-cn/web/api/document/getelementbyid/index.md
@@ -31,16 +31,16 @@ getElementById(id)
 ### HTML
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
-  <title>getElementById example</title>
-</head>
-<body>
-  <p id="para">Some text here</p>
-  <button onclick="changeColor('blue');">blue</button>
-  <button onclick="changeColor('red');">red</button>
-</body>
+  <head>
+    <title>getElementById example</title>
+  </head>
+  <body>
+    <p id="para">Some text here</p>
+    <button onclick="changeColor('blue');">blue</button>
+    <button onclick="changeColor('red');">red</button>
+  </body>
 </html>
 ```
 
@@ -48,7 +48,7 @@ getElementById(id)
 
 ```js
 function changeColor(newColor) {
-  var elem = document.getElementById('para');
+  var elem = document.getElementById("para");
   elem.style.color = newColor;
 }
 ```
@@ -95,8 +95,8 @@ getElementById 方法不会搜索**不在文档中的元素**。当创建一个
 
 ```js
 var element = document.createElement("div");
-element.id = 'testqq';
-var el = document.getElementById('testqq'); // el 是个 null
+element.id = "testqq";
+var el = document.getElementById("testqq"); // el 是个 null
 ```
 
 **非 HTML 文档（Non-HTML documents**）。DOM 的实现必须说明哪个属性是 ID 类型。只有 DTD 定义了'id'是 ID 属性时’id‘才会被认为是 ID 属性。在 [XHTML](/zh-CN/docs/XHTML), [XUL](/zh-CN/docs/XUL)或者其他文档中，'id'通常被定义为 ID 类型的属性。不知道哪个属性是 ID 类型的实现中，这会返回 null 结果。
diff --git a/files/zh-cn/web/api/document/getelementsbyclassname/index.md b/files/zh-cn/web/api/document/getelementsbyclassname/index.md
index 42a477739c9924..3aec54f8f309a0 100644
--- a/files/zh-cn/web/api/document/getelementsbyclassname/index.md
+++ b/files/zh-cn/web/api/document/getelementsbyclassname/index.md
@@ -23,28 +23,31 @@ var elements = rootElement.getElementsByClassName(names);
 获取所有 class 为 'test' 的元素：
 
 ```js
-document.getElementsByClassName('test');
+document.getElementsByClassName("test");
 ```
 
 获取所有 class 同时包括 'red' 和 'test' 的元素。
 
 ```js
-document.getElementsByClassName('red test');
+document.getElementsByClassName("red test");
 ```
 
 在 id 为'main'的元素的子节点中，获取所有 class 为'test'的元素
 
 ```js
-document.getElementById('main').getElementsByClassName('test');
+document.getElementById("main").getElementsByClassName("test");
 ```
 
 我们还可以对任意的 {{ domxref("HTMLCollection") }} 使用 Array.prototype 的方法，调用时传递 _HTMLCollection_ 作为方法的参数。这里我们将查找到所有 class 为 'test' 的 div 元素：
 
 ```js
-var testElements = document.getElementsByClassName('test');
-var testDivs = Array.prototype.filter.call(testElements, function(testElement){
-    return testElement.nodeName === 'DIV';
-});
+var testElements = document.getElementsByClassName("test");
+var testDivs = Array.prototype.filter.call(
+  testElements,
+  function (testElement) {
+    return testElement.nodeName === "DIV";
+  },
+);
 ```
 
 ### 获取第一个类名为 test 的元素
@@ -53,25 +56,24 @@ var testDivs = Array.prototype.filter.call(testElements, function(testElement){
 
 ```html
 <html>
-<body>
-
+  <body>
     <div id="parent-id">
-        <p>hello world 1</p>
-        <p class="test">hello world 2</p>
-        <p>hello world 3</p>
-        <p>hello world 4</p>
+      <p>hello world 1</p>
+      <p class="test">hello world 2</p>
+      <p>hello world 3</p>
+      <p>hello world 4</p>
     </div>
 
     <script>
-        var parentDOM = document.getElementById("parent-id");
+      var parentDOM = document.getElementById("parent-id");
 
-        var test = parentDOM.getElementsByClassName("test"); // 匹配类名的元素集合，不是元素本身
-        console.log(test); //HTMLCollection[1]
+      var test = parentDOM.getElementsByClassName("test"); // 匹配类名的元素集合，不是元素本身
+      console.log(test); //HTMLCollection[1]
 
-        var testTarget = parentDOM.getElementsByClassName("test")[0]; // 我们想要取到的第一个元素
-        console.log(testTarget); //<p class="test">hello world 2</p>
+      var testTarget = parentDOM.getElementsByClassName("test")[0]; // 我们想要取到的第一个元素
+      console.log(testTarget); //<p class="test">hello world 2</p>
     </script>
-</body>
+  </body>
 </html>
 ```
 
@@ -93,18 +95,25 @@ var testDivs = Array.prototype.filter.call(testElements, function(testElement){
 
 ```js
 // getElementsByClassName selects partial matches
-var allOrangeJuiceByClass = document.getElementsByClassName('orange juice');
+var allOrangeJuiceByClass = document.getElementsByClassName("orange juice");
 var result = "document.getElementsByClassName('orange juice')";
-for (var i=0, len=allOrangeJuiceByClass.length|0; i<len; i=i+1|0) {
-    result += "\n  " + allOrangeJuiceByClass[i].textContent;
+for (
+  var i = 0, len = allOrangeJuiceByClass.length | 0;
+  i < len;
+  i = (i + 1) | 0
+) {
+  result += "\n  " + allOrangeJuiceByClass[i].textContent;
 }
 
-
 // querySelector only selects full complete matches
-var allOrangeJuiceQuery = document.querySelectorAll('.orange.juice');
+var allOrangeJuiceQuery = document.querySelectorAll(".orange.juice");
 result += "\n\ndocument.querySelectorAll('.orange.juice')";
-for (var i=0, len=allOrangeJuiceQuery.length|0; i<len; i=i+1|0) {
-    result += "\n  " + allOrangeJuiceQuery[i].textContent;
+for (
+  var i = 0, len = allOrangeJuiceQuery.length | 0;
+  i < len;
+  i = (i + 1) | 0
+) {
+  result += "\n  " + allOrangeJuiceQuery[i].textContent;
 }
 
 document.getElementById("resultArea").value = result;
diff --git a/files/zh-cn/web/api/document/getelementsbyname/index.md b/files/zh-cn/web/api/document/getelementsbyname/index.md
index 1223c705bdc1e8..f89bba1b35ffce 100644
--- a/files/zh-cn/web/api/document/getelementsbyname/index.md
+++ b/files/zh-cn/web/api/document/getelementsbyname/index.md
@@ -19,21 +19,21 @@ elements = document.getElementsByName(name)
 ## 例子
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
- ...
-</head>
-
-<body>
-<form name="up"><input type="text"></form>
-<div name="down"><input type="text"></div>
-
-<script>
-var up_forms = document.getElementsByName("up");
-console.log(up_forms[0].tagName); // returns "FORM"
-</script>
-</body>
+  <head>
+    ...
+  </head>
+
+  <body>
+    <form name="up"><input type="text" /></form>
+    <div name="down"><input type="text" /></div>
+
+    <script>
+      var up_forms = document.getElementsByName("up");
+      console.log(up_forms[0].tagName); // returns "FORM"
+    </script>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/getelementsbytagname/index.md b/files/zh-cn/web/api/document/getelementsbytagname/index.md
index c220bc27d0be02..8e0ed075f87f38 100644
--- a/files/zh-cn/web/api/document/getelementsbytagname/index.md
+++ b/files/zh-cn/web/api/document/getelementsbytagname/index.md
@@ -25,61 +25,62 @@ var elements = document.getElementsByTagName(name);
 注意调用 `getElementsByTagName()` 的不是那个文件节点 document，事实上是使用这个方法 {{domxref("element.getElementsByTagName()")}}。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8" />
-  <title>getElementsByTagName example</title>
-  <script>
-    function getAllParaElems() {
-      var allParas = document.getElementsByTagName("p");
-      var num = allParas.length;
-      alert("There are " + num + " paragraph in this document");
-    }
-
-    function div1ParaElems() {
-      var div1 = document.getElementById("div1");
-      var div1Paras = div1.getElementsByTagName("p");
-      var num = div1Paras.length;
-      alert("There are " + num + " paragraph in #div1");
-    }
-
-    function div2ParaElems() {
-      var div2 = document.getElementById("div2");
-      var div2Paras = div2.getElementsByTagName("p");
-      var num = div2Paras.length;
-      alert("There are " + num + " paragraph in #div2");
-    }
-  </script>
-</head>
-<body style="border: solid green 3px">
-  <p>Some outer text</p>
-  <p>Some outer text</p>
-
-  <div id="div1" style="border: solid blue 3px">
-    <p>Some div1 text</p>
-    <p>Some div1 text</p>
-    <p>Some div1 text</p>
-
-    <div id="div2" style="border: solid red 3px">
-      <p>Some div2 text</p>
-      <p>Some div2 text</p>
+  <head>
+    <meta charset="UTF-8" />
+    <title>getElementsByTagName example</title>
+    <script>
+      function getAllParaElems() {
+        var allParas = document.getElementsByTagName("p");
+        var num = allParas.length;
+        alert("There are " + num + " paragraph in this document");
+      }
+
+      function div1ParaElems() {
+        var div1 = document.getElementById("div1");
+        var div1Paras = div1.getElementsByTagName("p");
+        var num = div1Paras.length;
+        alert("There are " + num + " paragraph in #div1");
+      }
+
+      function div2ParaElems() {
+        var div2 = document.getElementById("div2");
+        var div2Paras = div2.getElementsByTagName("p");
+        var num = div2Paras.length;
+        alert("There are " + num + " paragraph in #div2");
+      }
+    </script>
+  </head>
+  <body style="border: solid green 3px">
+    <p>Some outer text</p>
+    <p>Some outer text</p>
+
+    <div id="div1" style="border: solid blue 3px">
+      <p>Some div1 text</p>
+      <p>Some div1 text</p>
+      <p>Some div1 text</p>
+
+      <div id="div2" style="border: solid red 3px">
+        <p>Some div2 text</p>
+        <p>Some div2 text</p>
+      </div>
     </div>
-  </div>
 
-  <p>Some outer text</p>
-  <p>Some outer text</p>
+    <p>Some outer text</p>
+    <p>Some outer text</p>
 
-  <button onclick="getAllParaElems();">
-    show all p elements in document</button><br />
+    <button onclick="getAllParaElems();">show all p elements in document</button
+    ><br />
 
-  <button onclick="div1ParaElems();">
-    show all p elements in div1 element</button><br />
+    <button onclick="div1ParaElems();">
+      show all p elements in div1 element</button
+    ><br />
 
-  <button onclick="div2ParaElems();">
-    show all p elements in div2 element</button>
-
-</body>
+    <button onclick="div2ParaElems();">
+      show all p elements in div2 element
+    </button>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/getelementsbytagnamens/index.md b/files/zh-cn/web/api/document/getelementsbytagnamens/index.md
index d326f92268e10a..a2a32781d11bc4 100644
--- a/files/zh-cn/web/api/document/getelementsbytagnamens/index.md
+++ b/files/zh-cn/web/api/document/getelementsbytagnamens/index.md
@@ -35,74 +35,76 @@ elements = document.getElementsByTagNameNS(namespace, name)
 
 ```html
 <html xmlns="http://www.w3.org/1999/xhtml">
-
-<head>
-<title>getElementsByTagNameNS example</title>
-
-<script type="text/javascript">
-
-function getAllParaElems()
-{
-  var allParas = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p");
-
-  var num = allParas.length;
-
-  alert("There are " + num + " &lt;p&gt; elements in this document");
-}
-
-
-function div1ParaElems()
-{
-  var div1 = document.getElementById("div1")
-  var div1Paras = div1.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p");
-
-  var num = div1Paras.length;
-
-  alert("There are " + num + " &lt;p&gt; elements in div1 element");
-}
-
-
-function div2ParaElems()
-{
-  var div2 = document.getElementById("div2")
-  var div2Paras = div2.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p");
-
-  var num = div2Paras.length;
-
-  alert("There are " + num + " &lt;p&gt; elements in div2 element");
-}
-
-</script>
-</head>
-
-<body style="border: solid green 3px">
-<p>Some outer text</p>
-<p>Some outer text</p>
-
-  <div id="div1" style="border: solid blue 3px">
-    <p>Some div1 text</p>
-    <p>Some div1 text</p>
-    <p>Some div1 text</p>
-
-    <div id="div2" style="border: solid red 3px">
-    <p>Some div2 text</p>
-    <p>Some div2 text</p>
+  <head>
+    <title>getElementsByTagNameNS example</title>
+
+    <script type="text/javascript">
+      function getAllParaElems() {
+        var allParas = document.getElementsByTagNameNS(
+          "http://www.w3.org/1999/xhtml",
+          "p",
+        );
+
+        var num = allParas.length;
+
+        alert("There are " + num + " &lt;p&gt; elements in this document");
+      }
+
+      function div1ParaElems() {
+        var div1 = document.getElementById("div1");
+        var div1Paras = div1.getElementsByTagNameNS(
+          "http://www.w3.org/1999/xhtml",
+          "p",
+        );
+
+        var num = div1Paras.length;
+
+        alert("There are " + num + " &lt;p&gt; elements in div1 element");
+      }
+
+      function div2ParaElems() {
+        var div2 = document.getElementById("div2");
+        var div2Paras = div2.getElementsByTagNameNS(
+          "http://www.w3.org/1999/xhtml",
+          "p",
+        );
+
+        var num = div2Paras.length;
+
+        alert("There are " + num + " &lt;p&gt; elements in div2 element");
+      }
+    </script>
+  </head>
+
+  <body style="border: solid green 3px">
+    <p>Some outer text</p>
+    <p>Some outer text</p>
+
+    <div id="div1" style="border: solid blue 3px">
+      <p>Some div1 text</p>
+      <p>Some div1 text</p>
+      <p>Some div1 text</p>
+
+      <div id="div2" style="border: solid red 3px">
+        <p>Some div2 text</p>
+        <p>Some div2 text</p>
+      </div>
     </div>
-  </div>
-
-<p>Some outer text</p>
-<p>Some outer text</p>
 
-<button onclick="getAllParaElems();">
- show all p elements in document</button><br />
+    <p>Some outer text</p>
+    <p>Some outer text</p>
 
-<button onclick="div1ParaElems();">
- show all p elements in div1 element</button><br />
+    <button onclick="getAllParaElems();">show all p elements in document</button
+    ><br />
 
-<button onclick="div2ParaElems();">
- show all p elements in div2 element</button>
+    <button onclick="div1ParaElems();">
+      show all p elements in div1 element</button
+    ><br />
 
-</body>
+    <button onclick="div2ParaElems();">
+      show all p elements in div2 element
+    </button>
+  </body>
 </html>
 ```
 
@@ -111,21 +113,27 @@ function div2ParaElems()
 如果所使用的浏览器不支持此方法，可使用另一种方法（例如遍历所有子元素的 DOM，识别所有 @xmlns 实例等等）来查找所有具有本地名称和命名空间的标签，但此方法更快。 (为了兼容 Explorer，在下面的函数中，你可以调用一个 XPath 包，而不仅仅是 XPath (由于 Explorer 支持不同 API 的 XPath ), 例如 [this wrapper class](http://www.davidflanagan.com/javascript5/display.php?n=21-10&f=21/10.js).)
 
 ```js
-function getElementsByTagNameNSWrapper (ns, elName, doc, context) {
-    if (!doc) {
-        doc = document;
-    }
-    if (!context) {
-        context = doc;
-    }
-
-    var result = doc.evaluate('//*[local-name()="'+elName+'" and namespace-uri() = "'+ns+'"]', context, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
-
-    var a = [];
-    for(var i = 0; i < result.snapshotLength; i++) {
-        a[i] = result.snapshotItem(i);
-    }
-    return a;
+function getElementsByTagNameNSWrapper(ns, elName, doc, context) {
+  if (!doc) {
+    doc = document;
+  }
+  if (!context) {
+    context = doc;
+  }
+
+  var result = doc.evaluate(
+    '//*[local-name()="' + elName + '" and namespace-uri() = "' + ns + '"]',
+    context,
+    null,
+    XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
+    null,
+  );
+
+  var a = [];
+  for (var i = 0; i < result.snapshotLength; i++) {
+    a[i] = result.snapshotItem(i);
+  }
+  return a;
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/getselection/index.md b/files/zh-cn/web/api/document/getselection/index.md
index 8930c124bbc13a..3aebfdd0212b8c 100644
--- a/files/zh-cn/web/api/document/getselection/index.md
+++ b/files/zh-cn/web/api/document/getselection/index.md
@@ -25,10 +25,10 @@ A {{DOMxRef("Selection")}} object.
 
 ```js
 function foo() {
-    var selObj = document.getSelection();
-    alert(selObj);
-    var selRange = selObj.getRangeAt(0);
-    // do stuff with the range
+  var selObj = document.getSelection();
+  alert(selObj);
+  var selRange = selObj.getRangeAt(0);
+  // do stuff with the range
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/hasstorageaccess/index.md b/files/zh-cn/web/api/document/hasstorageaccess/index.md
index 02cfdc0e793d41..7f64bcea5b066e 100644
--- a/files/zh-cn/web/api/document/hasstorageaccess/index.md
+++ b/files/zh-cn/web/api/document/hasstorageaccess/index.md
@@ -26,7 +26,7 @@ If the promise gets resolved and a user gesture event was being processed when t
 ## Examples
 
 ```js
-document.hasStorageAccess().then(hasAccess => {
+document.hasStorageAccess().then((hasAccess) => {
   if (hasAccess) {
     // storage access has been granted already.
   } else {
diff --git a/files/zh-cn/web/api/document/head/index.md b/files/zh-cn/web/api/document/head/index.md
index 5f7520ca0ac11c..a85aaeccadddf3 100644
--- a/files/zh-cn/web/api/document/head/index.md
+++ b/files/zh-cn/web/api/document/head/index.md
@@ -23,7 +23,7 @@ var aHead = document.head;
 
 alert(aHead.id); // "my-document-head";
 
-alert( document.head === document.querySelector("head") ); // true
+alert(document.head === document.querySelector("head")); // true
 ```
 
 ## 附注
diff --git a/files/zh-cn/web/api/document/hidden/index.md b/files/zh-cn/web/api/document/hidden/index.md
index 3fa3cd51a980cf..830b43413b5fd8 100644
--- a/files/zh-cn/web/api/document/hidden/index.md
+++ b/files/zh-cn/web/api/document/hidden/index.md
@@ -16,8 +16,8 @@ var string = document.hidden
 ## 示例
 
 ```js
-document.addEventListener("visibilitychange", function() {
-  console.log( document.hidden );
+document.addEventListener("visibilitychange", function () {
+  console.log(document.hidden);
   // Modify behavior...
 });
 ```
diff --git a/files/zh-cn/web/api/document/images/index.md b/files/zh-cn/web/api/document/images/index.md
index 7237f9bbde25ff..8677598d762eb3 100644
--- a/files/zh-cn/web/api/document/images/index.md
+++ b/files/zh-cn/web/api/document/images/index.md
@@ -33,10 +33,10 @@ firstImage = imageCollection[0];
 
 ```js
 var ilist = document.images;
-for(var i = 0; i < ilist.length; i++) {
-    if(ilist[i].src == "banner.gif") {
-         // 发现了 banner 图片
-    }
+for (var i = 0; i < ilist.length; i++) {
+  if (ilist[i].src == "banner.gif") {
+    // 发现了 banner 图片
+  }
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/implementation/index.md b/files/zh-cn/web/api/document/implementation/index.md
index 028186c090c4b1..7de2481926558c 100644
--- a/files/zh-cn/web/api/document/implementation/index.md
+++ b/files/zh-cn/web/api/document/implementation/index.md
@@ -20,9 +20,9 @@ DOMImpObj = document.implementation;
 ```js
 var modName = "HTML";
 var modVer = "2.0";
-var conformTest = document.implementation.hasFeature( modName, modVer );
+var conformTest = document.implementation.hasFeature(modName, modVer);
 
-alert( "DOM " + modName + " " + modVer + " supported?: " + conformTest );
+alert("DOM " + modName + " " + modVer + " supported?: " + conformTest);
 
 // alerts with: "DOM HTML 2.0 supported?: true" if DOM Level 2 HTML module is supported.
 ```
@@ -35,13 +35,13 @@ W3C 的 DOM1 级建议值规定了一种检测浏览器对某个 DOM 模型是
 
 ## 方法
 
-| 名称                                                                                                                                                             | 动作 | 返回值                               |
-| ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---- | ------------------------------------ |
+| 名称                                                                                                                                | 动作 | 返回值                      |
+| ----------------------------------------------------------------------------------------------------------------------------------- | ---- | --------------------------- |
 | {{domxref("DOMImplementation.createDocument","createDocument")}} (`namespaceURI`, `qualifiedNameStr`, {{domxref("DocumentType")}} ) |      | {{domxref("document")}}     |
-| {{domxref("DOMImplementation.createDocumentType","createDocumentType")}} ( `qualifiedNameStr`, `publicId`, `systemId` )                  |      | {{domxref("DocumentType")}} |
-| {{domxref("DOMImplementation.createHTMLDocument","createHTMLDocument")}} ( `title` )                                                     |      | {{domxref("document")}}     |
-| {{domxref("DOMImplementation.getFeature","getFeature")}} ( `feature`, `version` )                                                            |      | {{domxref("DOMObject")}}     |
-| {{domxref("DOMImplementation.hasFeature","hasFeature")}} ( `feature`, `version` )                                                            |      | {{domxref("Boolean")}}         |
+| {{domxref("DOMImplementation.createDocumentType","createDocumentType")}} ( `qualifiedNameStr`, `publicId`, `systemId` )             |      | {{domxref("DocumentType")}} |
+| {{domxref("DOMImplementation.createHTMLDocument","createHTMLDocument")}} ( `title` )                                                |      | {{domxref("document")}}     |
+| {{domxref("DOMImplementation.getFeature","getFeature")}} ( `feature`, `version` )                                                   |      | {{domxref("DOMObject")}}    |
+| {{domxref("DOMImplementation.hasFeature","hasFeature")}} ( `feature`, `version` )                                                   |      | {{domxref("Boolean")}}      |
 
 ## 规范
 
diff --git a/files/zh-cn/web/api/document/importnode/index.md b/files/zh-cn/web/api/document/importnode/index.md
index f5bc621e185585..fe2d040102fc1c 100644
--- a/files/zh-cn/web/api/document/importnode/index.md
+++ b/files/zh-cn/web/api/document/importnode/index.md
@@ -17,6 +17,7 @@ importNode(externalNode, deep)
 - `externalNode`
   - : 导入当前文档的外部 {{domxref("Node")}} 或 {{domxref("DocumentFragment")}}。
 - `deep` {{ optional_inline() }}
+
   - : 一个布尔值，默认为 `false`。表明是否要导入 `externalNode` 的整个 DOM 子树。
 
     - `deep` 设置为 `true`，则拷贝 `externalNode` 和它的所有后代。
@@ -25,7 +26,7 @@ importNode(externalNode, deep)
 ## 示例
 
 ```js
-const iframe  = document.querySelector("iframe");
+const iframe = document.querySelector("iframe");
 const oldNode = iframe.contentWindow.document.getElementById("myNode");
 const newNode = document.importNode(oldNode, true);
 document.getElementById("container").appendChild(newNode);
diff --git a/files/zh-cn/web/api/document/laststylesheetset/index.md b/files/zh-cn/web/api/document/laststylesheetset/index.md
index b9de6036bab076..15da15212fae03 100644
--- a/files/zh-cn/web/api/document/laststylesheetset/index.md
+++ b/files/zh-cn/web/api/document/laststylesheetset/index.md
@@ -23,10 +23,9 @@ var lastStyleSheetSet = document.lastStyleSheetSet
 let lastSheetSet = document.lastStyleSheetSet;
 
 if (!lastSheetSet) {
-  lastSheetSet = 'Style sheet not yet changed';
-}
-else {
-  console.log('The last style sheet set is: ' + lastSheetSet);
+  lastSheetSet = "Style sheet not yet changed";
+} else {
+  console.log("The last style sheet set is: " + lastSheetSet);
 }
 ```
 
diff --git a/files/zh-cn/web/api/document/links/index.md b/files/zh-cn/web/api/document/links/index.md
index f4fadd88defe8c..2327eaf2f5f323 100644
--- a/files/zh-cn/web/api/document/links/index.md
+++ b/files/zh-cn/web/api/document/links/index.md
@@ -21,7 +21,7 @@ nodeList = document.links
 
 ```js
 var links = document.links;
-for(var i = 0; i < links.length; i++) {
+for (var i = 0; i < links.length; i++) {
   var linkHref = document.createTextNode(links[i].href);
   var lineBreak = document.createElement("br");
   document.body.appendChild(linkHref);
diff --git a/files/zh-cn/web/api/document/location/index.md b/files/zh-cn/web/api/document/location/index.md
index b69debf165e958..432157218f6338 100644
--- a/files/zh-cn/web/api/document/location/index.md
+++ b/files/zh-cn/web/api/document/location/index.md
@@ -16,8 +16,8 @@ If the current document is not in a browsing context, the returned value is `nul
 ## 语法
 
 ```js
-locationObj = document.location
-document.location = 'http://www.mozilla.org' // Equivalent to document.location.href = 'http://www.mozilla.org'
+locationObj = document.location;
+document.location = "http://www.mozilla.org"; // Equivalent to document.location.href = 'http://www.mozilla.org'
 ```
 
 ## 示例
diff --git a/files/zh-cn/web/api/document/pictureinpictureenabled/index.md b/files/zh-cn/web/api/document/pictureinpictureenabled/index.md
index 79e03ae4e18a4f..29ebb5d4017c51 100644
--- a/files/zh-cn/web/api/document/pictureinpictureenabled/index.md
+++ b/files/zh-cn/web/api/document/pictureinpictureenabled/index.md
@@ -24,7 +24,7 @@ function requestPictureInPicture() {
   if (document.pictureInPictureEnabled) {
     videoElement.requestPictureInPicture();
   } else {
-    console.log('Your browser cannot use picture-in-picture right now');
+    console.log("Your browser cannot use picture-in-picture right now");
   }
 }
 ```
diff --git a/files/zh-cn/web/api/document/pointerlockchange_event/index.md b/files/zh-cn/web/api/document/pointerlockchange_event/index.md
index 28a45bfc293636..98c43c30d3462c 100644
--- a/files/zh-cn/web/api/document/pointerlockchange_event/index.md
+++ b/files/zh-cn/web/api/document/pointerlockchange_event/index.md
@@ -1,5 +1,5 @@
 ---
-title: 'Document: pointerlockchange event'
+title: "Document: pointerlockchange event"
 slug: Web/API/Document/pointerlockchange_event
 original_slug: Web/API/Element/pointerlockchange_event
 ---
@@ -36,8 +36,8 @@ original_slug: Web/API/Element/pointerlockchange_event
 使用 `addEventListener()`:
 
 ```js
-document.addEventListener('pointerlockchange', (event) => {
-  console.log('Pointer lock changed');
+document.addEventListener("pointerlockchange", (event) => {
+  console.log("Pointer lock changed");
 });
 ```
 
@@ -45,7 +45,7 @@ document.addEventListener('pointerlockchange', (event) => {
 
 ```js
 document.onpointerlockchange = (event) => {
-  console.log('Pointer lock changed');
+  console.log("Pointer lock changed");
 };
 ```
 
diff --git a/files/zh-cn/web/api/document/preferredstylesheetset/index.md b/files/zh-cn/web/api/document/preferredstylesheetset/index.md
index 9b58b475406c60..01c475a204c039 100644
--- a/files/zh-cn/web/api/document/preferredstylesheetset/index.md
+++ b/files/zh-cn/web/api/document/preferredstylesheetset/index.md
@@ -21,7 +21,9 @@ preferredStyleSheetSet = document.preferredStyleSheetSet
 
 ```js
 if (document.preferredStyleSheetSet) {
-  console.log("The preferred style sheet set is: " + document.preferredStyleSheetSet);
+  console.log(
+    "The preferred style sheet set is: " + document.preferredStyleSheetSet,
+  );
 } else {
   console.log("There is no preferred style sheet.");
 }
diff --git a/files/zh-cn/web/api/document/querycommandenabled/index.md b/files/zh-cn/web/api/document/querycommandenabled/index.md
index 6b51cb9f23988d..c7c48d498ccd53 100644
--- a/files/zh-cn/web/api/document/querycommandenabled/index.md
+++ b/files/zh-cn/web/api/document/querycommandenabled/index.md
@@ -35,7 +35,7 @@ var isEnabled = document.queryCommandEnabled(command);
 ```js
 var flg = document.queryCommandEnabled("SelectAll");
 
-if(flg) {
+if (flg) {
   document.execCommand("SelectAll", false, null); // command is enabled, run it
 }
 ```
diff --git a/files/zh-cn/web/api/document/querycommandsupported/index.md b/files/zh-cn/web/api/document/querycommandsupported/index.md
index b850a7aff5b69e..1938c60ccb6101 100644
--- a/files/zh-cn/web/api/document/querycommandsupported/index.md
+++ b/files/zh-cn/web/api/document/querycommandsupported/index.md
@@ -30,7 +30,7 @@ isSupported = document.queryCommandSupported(command);
 ```js
 var flg = document.queryCommandSupported("SelectAll");
 
-if(flg) {
+if (flg) {
   // ...Do something
 }
 ```
diff --git a/files/zh-cn/web/api/document/queryselector/index.md b/files/zh-cn/web/api/document/queryselector/index.md
index 2f8c72e05f7a97..812a86cf0fa6ec 100644
--- a/files/zh-cn/web/api/document/queryselector/index.md
+++ b/files/zh-cn/web/api/document/queryselector/index.md
@@ -48,15 +48,15 @@ CSS 伪类不会返回任何元素，见 [Selectors API](https://www.w3.org/TR/s
 <div id="foo:bar"></div>
 
 <script>
-  console.log('#foo\bar')               // "#fooar"
-  document.querySelector('#foo\bar')    // 不匹配任何元素
+  console.log("#foo\bar"); // "#fooar"
+  document.querySelector("#foo\bar"); // 不匹配任何元素
 
-  console.log('#foo\\bar')              // "#foo\bar"
-  console.log('#foo\\\\bar')            // "#foo\\bar"
-  document.querySelector('#foo\\\\bar') // 匹配第一个 div
+  console.log("#foo\\bar"); // "#foo\bar"
+  console.log("#foo\\\\bar"); // "#foo\\bar"
+  document.querySelector("#foo\\\\bar"); // 匹配第一个 div
 
-  document.querySelector('#foo:bar')    // 不匹配任何元素
-  document.querySelector('#foo\\:bar')  // 匹配第二个 div
+  document.querySelector("#foo:bar"); // 不匹配任何元素
+  document.querySelector("#foo\\:bar"); // 匹配第二个 div
 </script>
 ```
 
diff --git a/files/zh-cn/web/api/document/queryselectorall/index.md b/files/zh-cn/web/api/document/queryselectorall/index.md
index c0a80524bf8de1..551c64f39835e6 100644
--- a/files/zh-cn/web/api/document/queryselectorall/index.md
+++ b/files/zh-cn/web/api/document/queryselectorall/index.md
@@ -80,7 +80,7 @@ var matches = container.querySelectorAll("li[data-active='1']");
 ```js
 var highlightedItems = userList.querySelectorAll(".highlighted");
 
-highlightedItems.forEach(function(userItem) {
+highlightedItems.forEach(function (userItem) {
   deleteUser(userItem);
 });
 ```
@@ -96,8 +96,7 @@ highlightedItems.forEach(function(userItem) {
 ```html
 <div class="outer">
   <div class="select">
-    <div class="inner">
-    </div>
+    <div class="inner"></div>
   </div>
 </div>
 ```
@@ -105,8 +104,8 @@ highlightedItems.forEach(function(userItem) {
 ### JavaScript
 
 ```js
-var select = document.querySelector('.select');
-var inner = select.querySelectorAll('.outer .inner');
+var select = document.querySelector(".select");
+var inner = select.querySelectorAll(".outer .inner");
 inner.length; // 1, not 0!
 ```
 
@@ -115,8 +114,8 @@ inner.length; // 1, not 0!
 {{cssxref(":scope")}} 伪类符合预期的行为，只匹配基本元素后代的选择器：
 
 ```js
-var select = document.querySelector('.select');
-var inner = select.querySelectorAll(':scope .outer .inner');
+var select = document.querySelector(".select");
+var inner = select.querySelectorAll(":scope .outer .inner");
 inner.length; // 0
 ```
 
diff --git a/files/zh-cn/web/api/document/readystate/index.md b/files/zh-cn/web/api/document/readystate/index.md
index f0f0288655055a..6131d51a5d70e4 100644
--- a/files/zh-cn/web/api/document/readystate/index.md
+++ b/files/zh-cn/web/api/document/readystate/index.md
@@ -45,7 +45,7 @@ switch (document.readyState) {
   case "complete":
     // 页面所有内容都已被完全加载。
     let CSS_rule = document.styleSheets[0].cssRules[0].cssText;
-    console.log(`The first CSS rule is: ${CSS_rule }`);
+    console.log(`The first CSS rule is: ${CSS_rule}`);
     break;
 }
 ```
@@ -58,7 +58,7 @@ document.onreadystatechange = function () {
   if (document.readyState === "interactive") {
     initApplication();
   }
-}
+};
 ```
 
 ### 模拟 load 事件的 readystatechange
@@ -69,7 +69,7 @@ document.onreadystatechange = function () {
   if (document.readyState === "complete") {
     initApplication();
   }
-}
+};
 ```
 
 ### 在 DOMContentLoaded 之前使用 readystatechange 作为事件处理程序以插入或修改 DOM
diff --git a/files/zh-cn/web/api/document/readystatechange_event/index.md b/files/zh-cn/web/api/document/readystatechange_event/index.md
index 93071d506170c9..1f0d2ab6f72261 100644
--- a/files/zh-cn/web/api/document/readystatechange_event/index.md
+++ b/files/zh-cn/web/api/document/readystatechange_event/index.md
@@ -1,5 +1,5 @@
 ---
-title: 'Document: readystatechange 事件'
+title: "Document: readystatechange 事件"
 slug: Web/API/Document/readystatechange_event
 ---
 
@@ -66,7 +66,8 @@ body {
   resize: none;
 }
 
-label, button {
+label,
+button {
   display: block;
 }
 
@@ -78,26 +79,26 @@ label, button {
 #### JS
 
 ```js
-const log = document.querySelector('.event-log-contents');
-const reload = document.querySelector('#reload');
+const log = document.querySelector(".event-log-contents");
+const reload = document.querySelector("#reload");
 
-reload.addEventListener('click', () => {
-  log.textContent ='';
+reload.addEventListener("click", () => {
+  log.textContent = "";
   window.setTimeout(() => {
-      window.location.reload(true);
+    window.location.reload(true);
   }, 200);
 });
 
-window.addEventListener('load', (event) => {
-    log.textContent = log.textContent + 'load\n';
+window.addEventListener("load", (event) => {
+  log.textContent = log.textContent + "load\n";
 });
 
-document.addEventListener('readystatechange', (event) => {
-    log.textContent = log.textContent + `readystate: ${document.readyState}\n`;
+document.addEventListener("readystatechange", (event) => {
+  log.textContent = log.textContent + `readystate: ${document.readyState}\n`;
 });
 
-document.addEventListener('DOMContentLoaded', (event) => {
-    log.textContent = log.textContent + `DOMContentLoaded\n`;
+document.addEventListener("DOMContentLoaded", (event) => {
+  log.textContent = log.textContent + `DOMContentLoaded\n`;
 });
 ```
 
diff --git a/files/zh-cn/web/api/document/scroll_event/index.md b/files/zh-cn/web/api/document/scroll_event/index.md
index 8af4ea0b05932a..506300847917f7 100644
--- a/files/zh-cn/web/api/document/scroll_event/index.md
+++ b/files/zh-cn/web/api/document/scroll_event/index.md
@@ -1,5 +1,5 @@
 ---
-title: 'Document: scroll event'
+title: "Document: scroll event"
 slug: Web/API/Document/scroll_event
 ---
 
@@ -49,11 +49,11 @@ function doSomething(scroll_pos) {
   // 根据滚动位置做的事
 }
 
-window.addEventListener('scroll', function(e) {
+window.addEventListener("scroll", function (e) {
   last_known_scroll_position = window.scrollY;
 
   if (!ticking) {
-    window.requestAnimationFrame(function() {
+    window.requestAnimationFrame(function () {
       doSomething(last_known_scroll_position);
       ticking = false;
     });
diff --git a/files/zh-cn/web/api/document/selectionchange_event/index.md b/files/zh-cn/web/api/document/selectionchange_event/index.md
index 59eb3623a1c20f..d79bf40f36ee73 100644
--- a/files/zh-cn/web/api/document/selectionchange_event/index.md
+++ b/files/zh-cn/web/api/document/selectionchange_event/index.md
@@ -16,9 +16,9 @@ slug: Web/API/Document/selectionchange_event
 在 [`addEventListener()`](/zh-CN/docs/Web/API/EventTarget/addEventListener) 等方法中使用事件名称，或设置事件处理器属性。
 
 ```js
-addEventListener('selectionchange', (event) => {});
+addEventListener("selectionchange", (event) => {});
 
-onselectionchange = (event) => { };
+onselectionchange = (event) => {};
 ```
 
 ## 事件类型
diff --git a/files/zh-cn/web/api/document/stylesheets/index.md b/files/zh-cn/web/api/document/stylesheets/index.md
index 92ee15a05463ee..4cbf2a17e27a5d 100644
--- a/files/zh-cn/web/api/document/stylesheets/index.md
+++ b/files/zh-cn/web/api/document/stylesheets/index.md
@@ -11,7 +11,7 @@ slug: Web/API/Document/styleSheets
 
 ```js
 function getStyleSheet(unique_title) {
-  for (var i=0; i<document.styleSheets.length; i++) {
+  for (var i = 0; i < document.styleSheets.length; i++) {
     var sheet = document.styleSheets[i];
     if (sheet.title == unique_title) {
       return sheet;
diff --git a/files/zh-cn/web/api/document/title/index.md b/files/zh-cn/web/api/document/title/index.md
index 78ad2fd29cd900..6712b4c593f1d0 100644
--- a/files/zh-cn/web/api/document/title/index.md
+++ b/files/zh-cn/web/api/document/title/index.md
@@ -20,21 +20,19 @@ document.title = newTitle;
 ## 示例
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-US">
-<head>
-  <meta charset="UTF-8">
-  <title>Hello World!</title>
-</head>
-<body>
-
-  <script>
-    alert(document.title); // 显示 "Hello World!"
-    document.title = "Goodbye World!";
-    alert(document.title); // 显示 "Goodbye World!"
-  </script>
-
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <title>Hello World!</title>
+  </head>
+  <body>
+    <script>
+      alert(document.title); // 显示 "Hello World!"
+      document.title = "Goodbye World!";
+      alert(document.title); // 显示 "Goodbye World!"
+    </script>
+  </body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/document/visibilitychange_event/index.md b/files/zh-cn/web/api/document/visibilitychange_event/index.md
index 24a08f40e5c482..34529b201f88d5 100644
--- a/files/zh-cn/web/api/document/visibilitychange_event/index.md
+++ b/files/zh-cn/web/api/document/visibilitychange_event/index.md
@@ -30,20 +30,20 @@ slug: Web/API/Document/visibilitychange_event
 
 ## 属性
 
-| Property                              | Type                                 | Description                                            |
-| ------------------------------------- | ------------------------------------ | ------------------------------------------------------ |
+| Property                        | Type                       | Description                                            |
+| ------------------------------- | -------------------------- | ------------------------------------------------------ |
 | `target` {{readonlyInline}}     | {{domxref("EventTarget")}} | The event target (the topmost target in the DOM tree). |
-| `type` {{readonlyInline}}       | {{domxref("DOMString")}}     | The type of event.                                     |
-| `bubbles` {{readonlyInline}}    | {{jsxref("Boolean")}}         | Whether the event normally bubbles or not.             |
-| `cancelable` {{readonlyInline}} | {{jsxref("Boolean")}}         | Whether the event is cancellable or not.               |
+| `type` {{readonlyInline}}       | {{domxref("DOMString")}}   | The type of event.                                     |
+| `bubbles` {{readonlyInline}}    | {{jsxref("Boolean")}}      | Whether the event normally bubbles or not.             |
+| `cancelable` {{readonlyInline}} | {{jsxref("Boolean")}}      | Whether the event is cancellable or not.               |
 
 ## 例子
 
 本示例在文档可见时开始播放音乐曲目，在文档不再可见时暂停音乐。
 
 ```js
-document.addEventListener("visibilitychange", function() {
-  console.log( document.visibilityState );
+document.addEventListener("visibilitychange", function () {
+  console.log(document.visibilityState);
 });
 ```
 
diff --git a/files/zh-cn/web/api/document/visibilitystate/index.md b/files/zh-cn/web/api/document/visibilitystate/index.md
index d94729ceb91294..699e6bce409f4d 100644
--- a/files/zh-cn/web/api/document/visibilitystate/index.md
+++ b/files/zh-cn/web/api/document/visibilitystate/index.md
@@ -24,8 +24,8 @@ var string = document.visibilityState
 ## 示例
 
 ```js
-document.addEventListener("visibilitychange", function() {
-  console.log( document.visibilityState );
+document.addEventListener("visibilitychange", function () {
+  console.log(document.visibilityState);
   // Modify behavior...
 });
 ```
diff --git a/files/zh-cn/web/api/document/write/index.md b/files/zh-cn/web/api/document/write/index.md
index bfc7bcada628b7..4af512dd1507ad 100644
--- a/files/zh-cn/web/api/document/write/index.md
+++ b/files/zh-cn/web/api/document/write/index.md
@@ -24,9 +24,8 @@ document.write(markup);
 
 ```html
 <html>
-
-<head>
-    <meta charset="UTF-8">
+  <head>
+    <meta charset="UTF-8" />
     <title><code>document.write()</code> example</title>
 
     <script>
@@ -36,11 +35,10 @@ document.write(markup);
         document.close();
       }
     </script>
-</head>
-<body onload="newContent();">
+  </head>
+  <body onload="newContent();">
     <p>Some original document content.</p>
-</body>
-
+  </body>
 </html>
 ```
 
@@ -54,7 +52,7 @@ document.write(markup);
 
 ```html
 <script>
-  document.write("<h1>Main title</h1>")
+  document.write("<h1>Main title</h1>");
 </script>
 ```
 
diff --git a/files/zh-cn/web/api/document_object_model/examples/index.md b/files/zh-cn/web/api/document_object_model/examples/index.md
index bf43b4114124f3..9a5f93ca788a95 100644
--- a/files/zh-cn/web/api/document_object_model/examples/index.md
+++ b/files/zh-cn/web/api/document_object_model/examples/index.md
@@ -12,7 +12,7 @@ slug: Web/API/Document_Object_Model/Examples
 下面的示例展示了不同尺寸的图片对 `height` 和 `width` 属性的使用：
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <title>宽度/高度示例</title>
@@ -79,7 +79,7 @@ slug: Web/API/Document_Object_Model/Examples
 ## 示例 2：图片属性
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <title>修改图片的边框</title>
@@ -121,7 +121,7 @@ slug: Web/API/Document_Object_Model/Examples
 在这个简单的例子中，HTML 段落元素的一些基本样式属性是使用该元素上的样式对象和该对象的 CSS 样式属性来访问的，这些对象可以从 DOM 中检索和设置。在这个示例中，你是直接操作各个样式的。在下一个例子中（见示例 4），你可以使用样式表及其规则来改变整个文档的样式。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <title>改变颜色和字体大小的示例</title>
@@ -192,7 +192,7 @@ P
 然而，stopEvent 也调用了事件对象方法 {{domxref("event.stopPropagation")}}，它使事件不再向 DOM 中冒泡。请注意，表格本身有一个 {{domxref("Element.click_event", "onclick")}} 事件处理器，当表格被点击时应该显示一条信息。但是 stopEvent 方法已经停止了传播，所以在表格中的数据被更新后，事件阶段实际上已经结束，并且显示了一个警报框来确认这一点。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <title>事件传播</title>
@@ -243,7 +243,7 @@ P
 `getComputedStyle()` 返回一个 {{domxref("CSSStyleDeclaration")}} 对象，其各个样式属性可以用这个对象的 {{domxref("CSSStyleDeclaration.getPropertyValue()", "getPropertyValue()")}} 方法进行引用，正如下面的示例文档所示。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <title>getComputedStyle 示例</title>
@@ -310,7 +310,7 @@ P
 把下面的代码放到一个空白的文本文件中，并把它加载到各种浏览器中，你会对不同数量和名称的属性感到惊讶。你可能还想在页面中添加一些元素，从不同的事件处理程序中调用这个函数。
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
   <head>
     <meta charset="utf-8" />
diff --git a/files/zh-cn/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.md b/files/zh-cn/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.md
index f5ea2822325bb5..bb802bcf18d397 100644
--- a/files/zh-cn/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.md
+++ b/files/zh-cn/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.md
@@ -147,10 +147,7 @@ td {
 
 ```html
 <body>
-  <input
-    type="button"
-    value="设置段落背景颜色"
-    onclick="setBackground()" />
+  <input type="button" value="设置段落背景颜色" onclick="setBackground()" />
   <p>hi</p>
   <p>hello</p>
 </body>
@@ -275,9 +272,7 @@ sample1.html 中创建表格的基本步骤是：
 ```html
 <html lang="zh-CN">
   <head>
-    <title>
-      示例代码——使用 JavaScript 和 DOM 接口遍历 HTML 表格
-    </title>
+    <title>示例代码——使用 JavaScript 和 DOM 接口遍历 HTML 表格</title>
     <script>
       function start() {
         // 获取 body 的引用
@@ -297,7 +292,7 @@ sample1.html 中创建表格的基本步骤是：
             const myCurrentCell = document.createElement("td");
             // 创建文本节点
             const currentText = document.createTextNode(
-              `cell is row ${j}, column ${i}`
+              `cell is row ${j}, column ${i}`,
             );
             // 将文本节点附加至 <td> 中
             myCurrentCell.appendChild(currentText);
diff --git a/files/zh-cn/web/api/document_object_model/using_the_document_object_model/index.md b/files/zh-cn/web/api/document_object_model/using_the_document_object_model/index.md
index f04b96b852c747..b81f5d3bb485d3 100644
--- a/files/zh-cn/web/api/document_object_model/using_the_document_object_model/index.md
+++ b/files/zh-cn/web/api/document_object_model/using_the_document_object_model/index.md
@@ -5,7 +5,7 @@ slug: Web/API/Document_object_model/Using_the_Document_Object_Model
 
 {{DefaultAPISidebar("DOM")}}
 
-*文档对象模型*（DOM）是一个用于操作 HTML 和 XML 文档（包括其他树状文档）的 DOM 树的 API。这个 API 是页面描述的根源，并作为 web 脚本的基础。
+_文档对象模型_（DOM）是一个用于操作 HTML 和 XML 文档（包括其他树状文档）的 DOM 树的 API。这个 API 是页面描述的根源，并作为 web 脚本的基础。
 
 ## 什么是内容树？
 
diff --git a/files/zh-cn/web/api/document_object_model/whitespace/index.md b/files/zh-cn/web/api/document_object_model/whitespace/index.md
index 1b9234ad821915..870cc3297a9987 100644
--- a/files/zh-cn/web/api/document_object_model/whitespace/index.md
+++ b/files/zh-cn/web/api/document_object_model/whitespace/index.md
@@ -39,7 +39,7 @@ slug: Web/API/Document_Object_Model/Whitespace
 以下列文档为例：
 
 ```html
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-US">
   <head>
     <meta charset="UTF-8" />
@@ -342,7 +342,6 @@ li {
  * 不使用 JavaScript 的“\s”，因为它包含不断行空白字符等其他字符。
  */
 
-
 /**
  * 测知某节点的文字内容是否全为空白。
  *
@@ -353,7 +352,6 @@ function is_all_ws(nod) {
   return !/[^\t\n\r ]/.test(nod.textContent);
 }
 
-
 /**
  * 测知是否应在遍历时略过某节点。
  *
@@ -377,8 +375,7 @@ function is_ignorable(nod) {
  *               1) |sib| 的最近前一个“不可忽略节点”，由 |is_ignorable| 决定。或
  *               2) 若该节点前无任何此类节点，则返回 null。
  */
-function node_before( sib )
-{
+function node_before(sib) {
   while ((sib = sib.previousSibling)) {
     if (!is_ignorable(sib)) return sib;
   }
diff --git a/files/zh-cn/web/api/documentfragment/index.md b/files/zh-cn/web/api/documentfragment/index.md
index 1147f8d445aebc..59e447041e1bf3 100644
--- a/files/zh-cn/web/api/documentfragment/index.md
+++ b/files/zh-cn/web/api/documentfragment/index.md
@@ -63,18 +63,18 @@ _该接口继承 {{domxref("Node")}} 的全部方法。_
 ### JavaScript
 
 ```js
-const list = document.querySelector('#list')
-const fruits = ['Apple', 'Orange', 'Banana', 'Melon']
+const list = document.querySelector("#list");
+const fruits = ["Apple", "Orange", "Banana", "Melon"];
 
-const fragment = new DocumentFragment()
+const fragment = new DocumentFragment();
 
 fruits.forEach((fruit) => {
-  const li = document.createElement('li')
-  li.textContent = fruit
-  fragment.appendChild(li)
-})
+  const li = document.createElement("li");
+  li.textContent = fruit;
+  fragment.appendChild(li);
+});
 
-list.appendChild(fragment)
+list.appendChild(fragment);
 ```
 
 ### 结果
diff --git a/files/zh-cn/web/api/documentfragment/queryselector/index.md b/files/zh-cn/web/api/documentfragment/queryselector/index.md
index c09fd47c543a65..e9aabcee4ebc7a 100644
--- a/files/zh-cn/web/api/documentfragment/queryselector/index.md
+++ b/files/zh-cn/web/api/documentfragment/queryselector/index.md
@@ -41,10 +41,10 @@ var el = documentfragment.querySelector(".myclass");
 <div id="foo:bar"></div>
 
 <script>
-document.querySelector('#foo\bar')    // 啥也不匹配
-document.querySelector('#foo\\\\bar') // 第一个 DIV
-document.querySelector('#foo:bar')     // 啥也不匹配
-document.querySelector('#foo\\:bar')   // 第二个 DIV
+  document.querySelector("#foo\bar"); // 啥也不匹配
+  document.querySelector("#foo\\\\bar"); // 第一个 DIV
+  document.querySelector("#foo:bar"); // 啥也不匹配
+  document.querySelector("#foo\\:bar"); // 第二个 DIV
 </script>
 ```
 
diff --git a/files/zh-cn/web/api/domerror/index.md b/files/zh-cn/web/api/domerror/index.md
index 086ab6b10d9002..1de2d95d52ef97 100644
--- a/files/zh-cn/web/api/domerror/index.md
+++ b/files/zh-cn/web/api/domerror/index.md
@@ -16,29 +16,29 @@ slug: Web/API/DOMError
 
 ## Error 类型
 
-| Type                         | Description                                                                                                        |
-| ---------------------------- | ------------------------------------------------------------------------------------------------------------------ |
+| Type                         | Description                                                                                                  |
+| ---------------------------- | ------------------------------------------------------------------------------------------------------------ |
 | `IndexSizeError`             | The index is not in the allowed range (e.g. thrown in a {{ domxref("range") }} object). 索引不在允许的范围内 |
-| `HierarchyRequestError`      | The node tree hierarchy is not correct. 节点树层次结构是不正确的。                                                 |
-| `WrongDocumentError`         | The object is in the wrong {{ domxref("document") }}. 对象是错误的                                          |
-| `InvalidCharacterError`      | The string contains invalid characters. 字符串包含无效字符。                                                       |
-| `NoModificationAllowedError` | The object can not be modified. 对象不能被修改。                                                                   |
-| `NotFoundError`              | The object can not be found here. 对象不能在这里被找到。                                                           |
-| `NotSupportedError`          | The operation is not supported 不支持的操作                                                                        |
-| `InvalidStateError`          | The object is in an invalid state. 对象是一个无效的状态。                                                          |
-| `SyntaxError`                | The string did not match the expected pattern. 字符串不匹配预期的模式                                              |
-| `InvalidModificationError`   | The object can not be modified in this way. 对象不能以这种方式被修改                                               |
-| `NamespaceError`             | The operation is not allowed by Namespaces in XML 操作在 XML 命名空间内是不被允许的                                |
-| `InvalidAccessError`         | The object does not support the operation or argument. 对象不支持这种操作或参数。                                  |
-| `TypeMismatchError`          | The type of the object does not match the expected type. 对象的类型不匹配预期的类型。                              |
-| `SecurityError`              | The operation is insecure. 此操作是不安全的。                                                                      |
-| `NetworkError`               | A network error occurred. 发生网络错误                                                                             |
-| `AbortError`                 | The operation was aborted. 操作被中止                                                                              |
-| `URLMismatchError`           | The given URL does not match another URL. 给定的 URL 不匹配另一个 URL。                                            |
-| `QuotaExceededError`         | The quota has been exceeded. 已经超过给定配额。                                                                    |
-| `TimeoutError`               | The operation timed out. 操作超时。                                                                                |
-| `InvalidNodeTypeError`       | The node is incorrect or has an incorrect ancestor for this operation. 这个操作的 节点或节点祖先 是不正确的        |
-| `DataCloneError`             | The object can not be cloned. 对象不能克隆。                                                                       |
+| `HierarchyRequestError`      | The node tree hierarchy is not correct. 节点树层次结构是不正确的。                                           |
+| `WrongDocumentError`         | The object is in the wrong {{ domxref("document") }}. 对象是错误的                                           |
+| `InvalidCharacterError`      | The string contains invalid characters. 字符串包含无效字符。                                                 |
+| `NoModificationAllowedError` | The object can not be modified. 对象不能被修改。                                                             |
+| `NotFoundError`              | The object can not be found here. 对象不能在这里被找到。                                                     |
+| `NotSupportedError`          | The operation is not supported 不支持的操作                                                                  |
+| `InvalidStateError`          | The object is in an invalid state. 对象是一个无效的状态。                                                    |
+| `SyntaxError`                | The string did not match the expected pattern. 字符串不匹配预期的模式                                        |
+| `InvalidModificationError`   | The object can not be modified in this way. 对象不能以这种方式被修改                                         |
+| `NamespaceError`             | The operation is not allowed by Namespaces in XML 操作在 XML 命名空间内是不被允许的                          |
+| `InvalidAccessError`         | The object does not support the operation or argument. 对象不支持这种操作或参数。                            |
+| `TypeMismatchError`          | The type of the object does not match the expected type. 对象的类型不匹配预期的类型。                        |
+| `SecurityError`              | The operation is insecure. 此操作是不安全的。                                                                |
+| `NetworkError`               | A network error occurred. 发生网络错误                                                                       |
+| `AbortError`                 | The operation was aborted. 操作被中止                                                                        |
+| `URLMismatchError`           | The given URL does not match another URL. 给定的 URL 不匹配另一个 URL。                                      |
+| `QuotaExceededError`         | The quota has been exceeded. 已经超过给定配额。                                                              |
+| `TimeoutError`               | The operation timed out. 操作超时。                                                                          |
+| `InvalidNodeTypeError`       | The node is incorrect or has an incorrect ancestor for this operation. 这个操作的 节点或节点祖先 是不正确的  |
+| `DataCloneError`             | The object can not be cloned. 对象不能克隆。                                                                 |
 
 ## 浏览器兼容性
 
diff --git a/files/zh-cn/web/api/domimplementation/createdocument/index.md b/files/zh-cn/web/api/domimplementation/createdocument/index.md
index c2f8e5cd6e89ee..d0585b843b66d0 100644
--- a/files/zh-cn/web/api/domimplementation/createdocument/index.md
+++ b/files/zh-cn/web/api/domimplementation/createdocument/index.md
@@ -25,11 +25,15 @@ doc = document.implementation.createDocument(namespaceURI, qualifiedNameStr, doc
 ## 例子
 
 ```js
-var doc = document.implementation.createDocument ('http://www.w3.org/1999/xhtml', 'html', null);
-var body = document.createElementNS('http://www.w3.org/1999/xhtml', 'body');
-body.setAttribute('id', 'abc');
+var doc = document.implementation.createDocument(
+  "http://www.w3.org/1999/xhtml",
+  "html",
+  null,
+);
+var body = document.createElementNS("http://www.w3.org/1999/xhtml", "body");
+body.setAttribute("id", "abc");
 doc.documentElement.appendChild(body);
-alert(doc.getElementById('abc')); // [object HTMLBodyElement]
+alert(doc.getElementById("abc")); // [object HTMLBodyElement]
 ```
 
 ## 规范
diff --git a/files/zh-cn/web/api/domimplementation/createdocumenttype/index.md b/files/zh-cn/web/api/domimplementation/createdocumenttype/index.md
index b8994a3083372d..5e089f103370a4 100644
--- a/files/zh-cn/web/api/domimplementation/createdocumenttype/index.md
+++ b/files/zh-cn/web/api/domimplementation/createdocumenttype/index.md
@@ -25,8 +25,16 @@ var doctype = document.implementation.createDocumentType(qualifiedNameStr, publi
 ## 示例
 
 ```js
-var dt = document.implementation.createDocumentType('svg:svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd');
-var d = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg:svg', dt);
+var dt = document.implementation.createDocumentType(
+  "svg:svg",
+  "-//W3C//DTD SVG 1.1//EN",
+  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd",
+);
+var d = document.implementation.createDocument(
+  "http://www.w3.org/2000/svg",
+  "svg:svg",
+  dt,
+);
 alert(d.doctype.publicId); // -//W3C//DTD SVG 1.1//EN
 ```
 
diff --git a/files/zh-cn/web/api/domimplementation/createhtmldocument/index.md b/files/zh-cn/web/api/domimplementation/createhtmldocument/index.md
index 00fda26adb64d5..597875c26ef692 100644
--- a/files/zh-cn/web/api/domimplementation/createhtmldocument/index.md
+++ b/files/zh-cn/web/api/domimplementation/createhtmldocument/index.md
@@ -28,7 +28,10 @@ var doc = document.implementation.createHTMLDocument(title);
 
 ```html
 <body>
-  <p>Click <a href="javascript:makeDocument()">here</a> to create a new document and insert it below.</p>
+  <p>
+    Click <a href="javascript:makeDocument()">here</a> to create a new document
+    and insert it below.
+  </p>
   <iframe id="theFrame" src="about:blank" />
 </body>
 ```
@@ -45,7 +48,7 @@ function makeDocument() {
 
   try {
     doc.body.appendChild(p);
-  } catch(e) {
+  } catch (e) {
     console.log(e);
   }
 
@@ -70,11 +73,10 @@ function makeDocument() {
 ```html
 <!doctype html>
 <html>
-<head>
-<title>title</title>
-</head>
-<body>
-</body>
+  <head>
+    <title>title</title>
+  </head>
+  <body></body>
 </html>
 ```
 
diff --git a/files/zh-cn/web/api/domparser/index.md b/files/zh-cn/web/api/domparser/index.md
index 8b6dec6b34a74c..33aecb006cf264 100644
--- a/files/zh-cn/web/api/domparser/index.md
+++ b/files/zh-cn/web/api/domparser/index.md
@@ -26,7 +26,7 @@ let domparser = new DOMParser();
 ### 语法
 
 ```js
-let doc = domparser.parseFromString(string, mimeType)
+let doc = domparser.parseFromString(string, mimeType);
 ```
 
 ### 返回值
@@ -43,9 +43,9 @@ let doc = domparser.parseFromString(string, mimeType)
 
   - : 一个 {{domxref("DOMString")}}。This string determines a class of the the method's return value. The possible values are the following:
 
-| `mimeType`              | doc.constructor                        |
-| ----------------------- | -------------------------------------- |
-| `text/html`             | {{domxref("Document")}}     |
+| `mimeType`              | doc.constructor            |
+| ----------------------- | -------------------------- |
+| `text/html`             | {{domxref("Document")}}    |
 | `text/xml`              | {{domxref("XMLDocument")}} |
 | `application/xml`       | {{domxref("XMLDocument")}} |
 | `application/xhtml+xml` | {{domxref("XMLDocument")}} |
@@ -57,7 +57,7 @@ let doc = domparser.parseFromString(string, mimeType)
 
 ```js
 let parser = new DOMParser(),
-    doc = parser.parseFromString(stringContainingXMLSource, "application/xml");
+  doc = parser.parseFromString(stringContainingXMLSource, "application/xml");
 ```
 
 #### 错误处理
@@ -87,7 +87,7 @@ doc = parser.parseFromString(stringContainingXMLSource, "image/svg+xml");
 // 返回一个 SVGDocument 对象，同时也是一个 Document 对象。
 
 parser = new DOMParser();
-doc = parser.parseFromString(stringContainingHTMLSource, "text/html")
+doc = parser.parseFromString(stringContainingHTMLSource, "text/html");
 // 返回一个 HTMLDocument 对象，同时也是一个 Document 对象。
 ```
 
@@ -106,38 +106,35 @@ doc = parser.parseFromString(stringContainingHTMLSource, "text/html")
 /*! @source https://gist.github.com/1129031 */
 /*global document, DOMParser*/
 
-(function(DOMParser) {
-    "use strict";
-
-    var proto = DOMParser.prototype,
-        nativeParse = proto.parseFromString;
-
-    // Firefox/Opera/IE throw errors on unsupported types
-    try {
-        // WebKit returns null on unsupported types
-        if ((new DOMParser()).parseFromString("", "text/html")) {
-            // text/html parsing is natively supported
-            return;
-        }
-    } catch (ex) {}
-
-    proto.parseFromString = function(markup, type) {
-        if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {
-            var
-              doc = document.implementation.createHTMLDocument("")
-            ;
-                  if (markup.toLowerCase().indexOf('<!doctype') > -1) {
-                    doc.documentElement.innerHTML = markup;
-                  }
-                  else {
-                    doc.body.innerHTML = markup;
-                  }
-            return doc;
-        } else {
-            return nativeParse.apply(this, arguments);
-        }
-    };
-}(DOMParser));
+(function (DOMParser) {
+  "use strict";
+
+  var proto = DOMParser.prototype,
+    nativeParse = proto.parseFromString;
+
+  // Firefox/Opera/IE throw errors on unsupported types
+  try {
+    // WebKit returns null on unsupported types
+    if (new DOMParser().parseFromString("", "text/html")) {
+      // text/html parsing is natively supported
+      return;
+    }
+  } catch (ex) {}
+
+  proto.parseFromString = function (markup, type) {
+    if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {
+      var doc = document.implementation.createHTMLDocument("");
+      if (markup.toLowerCase().indexOf("<!doctype") > -1) {
+        doc.documentElement.innerHTML = markup;
+      } else {
+        doc.body.innerHTML = markup;
+      }
+      return doc;
+    } else {
+      return nativeParse.apply(this, arguments);
+    }
+  };
+})(DOMParser);
 ```
 
 ## 规范
diff --git a/files/zh-cn/web/api/dompoint/index.md b/files/zh-cn/web/api/dompoint/index.md
index e16b94fcfbf2a1..9f235afea86127 100644
--- a/files/zh-cn/web/api/dompoint/index.md
+++ b/files/zh-cn/web/api/dompoint/index.md
@@ -43,9 +43,13 @@ function setView() {
   var posState = gPositionSensor.getState();
 
   if (posState.hasPosition) {
-    posPara.textContent = 'Position: x' + roundToTwo(posState.position.x) + " y"
-                                        + roundToTwo(posState.position.y) + " z"
-                                        + roundToTwo(posState.position.z);
+    posPara.textContent =
+      "Position: x" +
+      roundToTwo(posState.position.x) +
+      " y" +
+      roundToTwo(posState.position.y) +
+      " z" +
+      roundToTwo(posState.position.z);
     xPos = -posState.position.x * WIDTH * 2;
     yPos = posState.position.y * HEIGHT * 2;
 
@@ -57,7 +61,6 @@ function setView() {
   }
 
   /* ... */
-
 }
 ```
 
diff --git a/files/zh-cn/web/api/domrect/domrect/index.md b/files/zh-cn/web/api/domrect/domrect/index.md
index 04a694e3a78959..8c849600466107 100644
--- a/files/zh-cn/web/api/domrect/domrect/index.md
+++ b/files/zh-cn/web/api/domrect/domrect/index.md
@@ -29,7 +29,7 @@ var myDOMRect = new DOMRect(x, y, width, height);
 想生成一个新 `DOMRect`，你可以运行一行这样的代码：
 
 ```js
-myDOMRect = new DOMRect(0,0,100,100);
+myDOMRect = new DOMRect(0, 0, 100, 100);
 // running 'myDOMRect' in the console would then return
 // DOMRect { x: 0, y: 0, width: 100, height: 100, top: 0, right: 100, bottom: 100, left: 0 }
 ```
diff --git a/files/zh-cn/web/api/domtokenlist/contains/index.md b/files/zh-cn/web/api/domtokenlist/contains/index.md
index e266f2f578f009..8d9e218180f5db 100644
--- a/files/zh-cn/web/api/domtokenlist/contains/index.md
+++ b/files/zh-cn/web/api/domtokenlist/contains/index.md
@@ -41,7 +41,7 @@ let result = classes.contains("c");
 if (result) {
   span.textContent = "The classList contains 'c'";
 } else {
-   span.textContent = "The classList does not contain 'c'";
+  span.textContent = "The classList does not contain 'c'";
 }
 ```
 
diff --git a/files/zh-cn/web/api/domtokenlist/index.md b/files/zh-cn/web/api/domtokenlist/index.md
index 8e68f214fd5050..b19ce9bb077652 100644
--- a/files/zh-cn/web/api/domtokenlist/index.md
+++ b/files/zh-cn/web/api/domtokenlist/index.md
@@ -29,7 +29,7 @@ slug: Web/API/DOMTokenList
 - {{domxref("DOMTokenList.supports()", "DOMTokenList.supports(<var>token</var>)")}}
   - : 如果传入的 `token` 是相关属性（attribute）支持的标记，则返回 `true` 。
 - {{domxref("DOMTokenList.toggle()", "DOMTokenList.toggle(<var>token</var> [, <var>force</var>])")}}
-  - : 从 DOMTokenList 字符串中移除标记字串（`token`），并返回 `false`。如果传入的字串（`token`）不存在，则将其添加进去，并返回 `true` 。`force` 是一个可选的布尔值，如果传入 `true` ，且传入的 _`token`_ 不存在，则将其添加进去并返回 `true` ，若传入的 _`token` _存在，则直接返回 `true` ；反之，如果传入 `false` ，则移除存在的 `token`，并返回 `false` ，如 `token` 不存在则直接返回 `false` 。
+  - : 从 DOMTokenList 字符串中移除标记字串（`token`），并返回 `false`。如果传入的字串（`token`）不存在，则将其添加进去，并返回 `true` 。`force` 是一个可选的布尔值，如果传入 `true` ，且传入的 _`token`_ 不存在，则将其添加进去并返回 `true` ，若传入的 _`token`_ 存在，则直接返回 `true` ；反之，如果传入 `false` ，则移除存在的 `token`，并返回 `false` ，如 `token` 不存在则直接返回 `false` 。
 - {{domxref("DOMTokenList.entries()")}}
   - : 返回一个迭代器（{{jsxref("Iteration_protocols","iterator")}}），以遍历这个对象中的所有键值对。
 - {{domxref("DOMTokenList.forEach()", "DOMTokenList.forEach(<var>callback</var> [, <var>thisArg</var>])")}}
diff --git a/files/zh-cn/web/api/domtokenlist/item/index.md b/files/zh-cn/web/api/domtokenlist/item/index.md
index 96b453b3001b9d..959cc031599b8c 100644
--- a/files/zh-cn/web/api/domtokenlist/item/index.md
+++ b/files/zh-cn/web/api/domtokenlist/item/index.md
@@ -37,7 +37,7 @@ tokenList.item(index)
 ```js
 let span = document.querySelector("span");
 let classes = span.classList;
-let item = classes.item(classes.length-1);
+let item = classes.item(classes.length - 1);
 span.textContent = item;
 ```
 
diff --git a/files/zh-cn/web/api/domtokenlist/keys/index.md b/files/zh-cn/web/api/domtokenlist/keys/index.md
index bd300ce7644faf..d11a39bdd37b5f 100644
--- a/files/zh-cn/web/api/domtokenlist/keys/index.md
+++ b/files/zh-cn/web/api/domtokenlist/keys/index.md
@@ -38,8 +38,8 @@ var span = document.querySelector("span");
 var classes = span.classList;
 var iterator = classes.keys();
 
-for(var value of iterator) {
-  span.textContent += value + ' ++ ';
+for (var value of iterator) {
+  span.textContent += value + " ++ ";
 }
 ```
 
diff --git a/files/zh-cn/web/api/domtokenlist/length/index.md b/files/zh-cn/web/api/domtokenlist/length/index.md
index a7a6043249ff21..50fb797c788e1f 100644
--- a/files/zh-cn/web/api/domtokenlist/length/index.md
+++ b/files/zh-cn/web/api/domtokenlist/length/index.md
@@ -34,7 +34,7 @@ var span = document.querySelector("span");
 var classes = span.classList;
 var length = classes.length;
 
-span.textContent = 'classList length = ' + length;
+span.textContent = "classList length = " + length;
 ```
 
 运行得出的结果如下：
diff --git a/files/zh-cn/web/api/domtokenlist/replace/index.md b/files/zh-cn/web/api/domtokenlist/replace/index.md
index 3a21a78eed015c..b615df235dc6ee 100644
--- a/files/zh-cn/web/api/domtokenlist/replace/index.md
+++ b/files/zh-cn/web/api/domtokenlist/replace/index.md
@@ -48,7 +48,7 @@ console.log(result);
 if (result) {
   span.textContent = classes;
 } else {
-  span.textContent = 'token not replaced successfully';
+  span.textContent = "token not replaced successfully";
 }
 ```
 
diff --git a/files/zh-cn/web/api/domtokenlist/supports/index.md b/files/zh-cn/web/api/domtokenlist/supports/index.md
index 2574894a41e7f4..1088bf5cacddcb 100644
--- a/files/zh-cn/web/api/domtokenlist/supports/index.md
+++ b/files/zh-cn/web/api/domtokenlist/supports/index.md
@@ -25,15 +25,15 @@ supports(token);
 ## 示例
 
 ```js
-const iframe = document.getElementById('display');
+const iframe = document.getElementById("display");
 
-if (iframe.sandbox.supports('an-upcoming-feature')) {
+if (iframe.sandbox.supports("an-upcoming-feature")) {
   // support code for mystery future feature
 } else {
   // fallback code
 }
 
-if (iframe.sandbox.supports('allow-scripts')) {
+if (iframe.sandbox.supports("allow-scripts")) {
   // instruct frame to run JavaScript
   //
   // (NOTE: This feature is well-supported; this is just an example!)
diff --git a/files/zh-cn/web/api/domtokenlist/toggle/index.md b/files/zh-cn/web/api/domtokenlist/toggle/index.md
index a01ca3e3632222..7ea83da9322cdb 100644
--- a/files/zh-cn/web/api/domtokenlist/toggle/index.md
+++ b/files/zh-cn/web/api/domtokenlist/toggle/index.md
@@ -43,7 +43,7 @@ toggle(token, force);
 const span = document.querySelector("span");
 const classes = span.classList;
 
-span.addEventListener('click', () => {
+span.addEventListener("click", () => {
   const result = classes.toggle("c");
 
   if (result) {
@@ -51,7 +51,7 @@ span.addEventListener('click', () => {
   } else {
     span.textContent = `'c' removed; classList is now "${classes}".`;
   }
-})
+});
 ```
 
 输出如下所示，并且每次点击文本时都会发生变化：
diff --git a/files/zh-cn/web/api/dragevent/datatransfer/index.md b/files/zh-cn/web/api/dragevent/datatransfer/index.md
index 8c7f23da976b74..7954ba235eee32 100644
--- a/files/zh-cn/web/api/dragevent/datatransfer/index.md
+++ b/files/zh-cn/web/api/dragevent/datatransfer/index.md
@@ -26,13 +26,17 @@ var data = dragEvent.dataTransfer;
 
 ```js
 function process_data(d) {
-   // Process the data ...
+  // Process the data ...
 }
 
-dragTarget.addEventListener("dragend", function(ev) {
-   // Call the drag and drop data processor
-   if (ev.dataTransfer != null) process_data(ev.dataTransfer);
- }, false);
+dragTarget.addEventListener(
+  "dragend",
+  function (ev) {
+    // Call the drag and drop data processor
+    if (ev.dataTransfer != null) process_data(ev.dataTransfer);
+  },
+  false,
+);
 ```
 
 ## 规范
diff --git a/files/zh-cn/web/api/element/after/index.md b/files/zh-cn/web/api/element/after/index.md
index bfcad032bdd8a4..8ea798e24f89e8 100644
--- a/files/zh-cn/web/api/element/after/index.md
+++ b/files/zh-cn/web/api/element/after/index.md
@@ -9,16 +9,18 @@ slug: Web/API/Element/after
 
 ## 语法
 
-```js
-after(... nodes)
+```js-nolint
+after(node1)
+after(node1, node2)
+after(node1, node2, /* … ,*/ nodeN)
 ```
 
 ### 参数
 
-- `nodes`
-  - : 一组准备插入的 {{domxref("Node")}} 或 {{domxref("DOMString")}} 。
+- `node1`, …, `nodeN`
+  - : 一组准备插入的 {{domxref("Node")}} 或字符串。
 
-### 错误
+### 异常
 
 - {{domxref("HierarchyRequestError")}}: 在某些不正确的层级结构进行了插入操作。
 
diff --git a/files/zh-cn/web/api/element/animate/index.md b/files/zh-cn/web/api/element/animate/index.md
index 1ad0317c62ee73..07e2673fd98279 100644
--- a/files/zh-cn/web/api/element/animate/index.md
+++ b/files/zh-cn/web/api/element/animate/index.md
@@ -70,18 +70,18 @@ body {
 
 ```js
 const newspaperSpinning = [
-  { transform: 'rotate(0) scale(1)' },
-  { transform: 'rotate(360deg) scale(0)' }
+  { transform: "rotate(0) scale(1)" },
+  { transform: "rotate(360deg) scale(0)" },
 ];
 
 const newspaperTiming = {
   duration: 2000,
   iterations: 1,
-}
+};
 
 const newspaper = document.querySelector(".newspaper");
 
-newspaper.addEventListener('click', () => {
+newspaper.addEventListener("click", () => {
   newspaper.animate(newspaperSpinning, newspaperTiming);
 });
 ```
@@ -95,15 +95,18 @@ newspaper.addEventListener('click', () => {
 在演示 [Down the Rabbit Hole (with the Web Animation API)](https://codepen.io/rachelnabors/pen/rxpmJL/?editors=0010) 中，我们用 `animate()` 来快速创建并运行使 `#tunnel` 元素无限循环缓慢升起的动画。注意关键帧的对象数组和时间可选项。
 
 ```js
-document.getElementById("tunnel").animate([
-  // keyframes
-  { transform: 'translateY(0px)' },
-  { transform: 'translateY(-300px)' }
-], {
-  // timing options
-  duration: 1000,
-  iterations: Infinity
-});
+document.getElementById("tunnel").animate(
+  [
+    // keyframes
+    { transform: "translateY(0px)" },
+    { transform: "translateY(-300px)" },
+  ],
+  {
+    // timing options
+    duration: 1000,
+    iterations: Infinity,
+  },
+);
 ```
 
 ### 隐含关键帧
@@ -111,9 +114,7 @@ document.getElementById("tunnel").animate([
 在新版的浏览器中，你可以只设置动画的开始或结束状态（即单个关键帧），如果可以，浏览器会自动推断动画的另一端（结束或开始）的状态。例如，考虑[这个简单动画](https://mdn.github.io/dom-examples/web-animations-api/implicit-keyframes.html)——关键帧对象如下所示：
 
 ```js
-let rotate360 = [
-  { transform: 'rotate(360deg)' }
-];
+let rotate360 = [{ transform: "rotate(360deg)" }];
 ```
 
 我们仅指定了动画的结束状态，开始状态是隐含的。
diff --git a/files/zh-cn/web/api/element/animationcancel_event/index.md b/files/zh-cn/web/api/element/animationcancel_event/index.md
index e40e906668577f..d69ec28a2d6c35 100644
--- a/files/zh-cn/web/api/element/animationcancel_event/index.md
+++ b/files/zh-cn/web/api/element/animationcancel_event/index.md
@@ -26,9 +26,7 @@ target.onanimationcancel = {{jsxref("Function")}}
   </div>
 </div>
 
-<div class="button" id="toggleBox">
-  Hide the Box
-</div>
+<div class="button" id="toggleBox">Hide the Box</div>
 
 <pre id="log"></pre>
 ```
@@ -37,12 +35,12 @@ target.onanimationcancel = {{jsxref("Function")}}
 
 ```css hidden
 :root {
-  --boxwidth:50px;
+  --boxwidth: 50px;
 }
 
 .main {
   width: 300px;
-  height:300px;
+  height: 300px;
   border: 1px solid black;
 }
 
@@ -57,7 +55,10 @@ target.onanimationcancel = {{jsxref("Function")}}
   padding-bottom: 4px;
   color: white;
   background-color: darkgreen;
-  font: 14px "Open Sans", "Arial", sans-serif;
+  font:
+    14px "Open Sans",
+    "Arial",
+    sans-serif;
 }
 
 #text {
@@ -67,7 +68,10 @@ target.onanimationcancel = {{jsxref("Function")}}
   text-align: center;
   align-self: center;
   color: white;
-  font: bold 1.4em "Lucida Grande", "Open Sans", sans-serif;
+  font:
+    bold 1.4em "Lucida Grande",
+    "Open Sans",
+    sans-serif;
 }
 ```
 
@@ -79,10 +83,10 @@ Leaving out some bits of the CSS that don't matter for the discussion here, let'
   height: var(--boxwidth);
   left: 0;
   top: 0;
-  border: 1px solid #7788FF;
+  border: 1px solid #7788ff;
   margin: 0;
   position: relative;
-  background-color: #2233FF;
+  background-color: #2233ff;
   display: flex;
   justify-content: center;
   animation: 5s ease-in-out 0s infinite alternate both slideBox;
@@ -94,12 +98,12 @@ The animation's keyframes are described next, plotting a course from the top-lef
 ```css
 @keyframes slideBox {
   from {
-    left:0;
-    top:0;
+    left: 0;
+    top: 0;
   }
   to {
-    left:calc(100% - var(--boxwidth));
-    top:calc(100% - var(--boxwidth))
+    left: calc(100% - var(--boxwidth));
+    top: calc(100% - var(--boxwidth));
   }
 }
 ```
@@ -117,13 +121,16 @@ function log(msg, event) {
   logBox.innerHTML += msg;
 
   if (event) {
-    logBox.innerHTML += " <code>"+ event.animationName +
-        "</code> at time " + event.elapsedTime.toFixed(2) +
-        " seconds.";
+    logBox.innerHTML +=
+      " <code>" +
+      event.animationName +
+      "</code> at time " +
+      event.elapsedTime.toFixed(2) +
+      " seconds.";
   }
 
   logBox.innerHTML += "\n";
-};
+}
 ```
 
 Then we set up the `handleCancelEvent()` function, which is called in response to the `animationcancel` event, as set up in the HTML above. All we do here is log information to the console, but you might find other use cases, such as starting a new animation or effect, or terminating some dependent operation.
@@ -131,7 +138,7 @@ Then we set up the `handleCancelEvent()` function, which is called in response t
 ```js
 function handleCancelEvent(event) {
   log("Animation canceled", event);
-};
+}
 ```
 
 Then we add a method to handle toggle {{cssxref("display")}} between `"flex"` and `"none"` and establish it as the handler for a [`click`](/zh-CN/docs/Web/API/Element/click_event) event on the "Hide/Show" the Box button:
diff --git a/files/zh-cn/web/api/element/animationend_event/index.md b/files/zh-cn/web/api/element/animationend_event/index.md
index 7defb2accf6dc2..72bd787dd27d6d 100644
--- a/files/zh-cn/web/api/element/animationend_event/index.md
+++ b/files/zh-cn/web/api/element/animationend_event/index.md
@@ -12,9 +12,9 @@ slug: Web/API/Element/animationend_event
 在 {{domxref("EventTarget.addEventListener", "addEventListener()")}} 方法中使用事件名称，或设置事件处理器属性。
 
 ```js
-addEventListener('animationend', (event) => {});
+addEventListener("animationend", (event) => {});
 
-onanimationend = (event) => { };
+onanimationend = (event) => {};
 ```
 
 ## 事件类型
@@ -39,20 +39,20 @@ _也从其父接口 {{domxref("Event")}} 继承属性_。
 该实例获取一个正在绘制动画的元素，并监听 `animationend` 事件。
 
 ```js
-const animated = document.querySelector('.animated');
+const animated = document.querySelector(".animated");
 
-animated.addEventListener('animationend', () => {
-  console.log('Animation ended');
+animated.addEventListener("animationend", () => {
+  console.log("Animation ended");
 });
 ```
 
 同上，但使用 `onanimationend` 事件处理器属性：
 
 ```js
-const animated = document.querySelector('.animated');
+const animated = document.querySelector(".animated");
 
 animated.onanimationend = () => {
-  console.log('Animation ended');
+  console.log("Animation ended");
 };
 ```
 
@@ -107,35 +107,39 @@ animated.onanimationend = () => {
 #### JavaScript
 
 ```js
-const animation = document.querySelector('p.animation');
-const animationEventLog = document.querySelector('.animation-example>.event-log');
-const applyAnimation = document.querySelector('.animation-example>button.activate');
+const animation = document.querySelector("p.animation");
+const animationEventLog = document.querySelector(
+  ".animation-example>.event-log",
+);
+const applyAnimation = document.querySelector(
+  ".animation-example>button.activate",
+);
 let iterationCount = 0;
 
-animation.addEventListener('animationstart', () => {
+animation.addEventListener("animationstart", () => {
   animationEventLog.textContent = `${animationEventLog.textContent}'动画开始' `;
 });
 
-animation.addEventListener('animationiteration', () => {
+animation.addEventListener("animationiteration", () => {
   iterationCount++;
   animationEventLog.textContent = `${animationEventLog.textContent}'动画迭代轮次：${iterationCount}' `;
 });
 
-animation.addEventListener('animationend', () => {
+animation.addEventListener("animationend", () => {
   animationEventLog.textContent = `${animationEventLog.textContent}'动画结束'`;
-  animation.classList.remove('active');
+  animation.classList.remove("active");
   applyAnimation.textContent = "激活动画";
 });
 
-animation.addEventListener('animationcancel', () => {
+animation.addEventListener("animationcancel", () => {
   animationEventLog.textContent = `${animationEventLog.textContent}'动画已被取消'`;
 });
 
-applyAnimation.addEventListener('click', () => {
-  animation.classList.toggle('active');
-  animationEventLog.textContent = '';
+applyAnimation.addEventListener("click", () => {
+  animation.classList.toggle("active");
+  animationEventLog.textContent = "";
   iterationCount = 0;
-  const active = animation.classList.contains('active');
+  const active = animation.classList.contains("active");
   applyAnimation.textContent = active ? "取消动画" : "激活动画";
 });
 ```
diff --git a/files/zh-cn/web/api/element/animationiteration_event/index.md b/files/zh-cn/web/api/element/animationiteration_event/index.md
index f666df44f34fbf..0d1b9577fcc8d0 100644
--- a/files/zh-cn/web/api/element/animationiteration_event/index.md
+++ b/files/zh-cn/web/api/element/animationiteration_event/index.md
@@ -30,21 +30,19 @@ Let's create an animation which automatically pauses at the end of each iteratio
   </div>
 </div>
 
-<div class="button" id="play">
-  Begin Demonstration
-</div>
+<div class="button" id="play">Begin Demonstration</div>
 ```
 
 ### CSS
 
 ```css hidden
 :root {
-  --boxwidth:50px;
+  --boxwidth: 50px;
 }
 
 .main {
   width: 300px;
-  height:300px;
+  height: 300px;
   border: 1px solid black;
 }
 
@@ -59,7 +57,10 @@ Let's create an animation which automatically pauses at the end of each iteratio
   padding-bottom: 4px;
   color: white;
   background-color: darkgreen;
-  font: 14px "Open Sans", "Arial", sans-serif;
+  font:
+    14px "Open Sans",
+    "Arial",
+    sans-serif;
 }
 
 #text {
@@ -69,10 +70,11 @@ Let's create an animation which automatically pauses at the end of each iteratio
   text-align: center;
   align-self: center;
   color: white;
-  font: bold 1.4em "Lucida Grande", "Open Sans", sans-serif;
+  font:
+    bold 1.4em "Lucida Grande",
+    "Open Sans",
+    sans-serif;
 }
-
-
 ```
 
 Leaving out some bits of the CSS that don't matter for the discussion here, let's take a look at the styles for the box that we're animating. First is the box itself. We set its size, position, color, and layout. Note that there's nothing there about animation. That's because we don't want the box to start animating right away. We'll add the {{cssxref("animation")}} style later to start animating the box.
@@ -83,10 +85,10 @@ Leaving out some bits of the CSS that don't matter for the discussion here, let'
   height: var(--boxwidth);
   left: 0;
   top: 0;
-  border: 1px solid #7788FF;
+  border: 1px solid #7788ff;
   margin: 0;
   position: relative;
-  background-color: #2233FF;
+  background-color: #2233ff;
   display: flex;
   justify-content: center;
   animation: 2s ease-in-out 0s infinite alternate both paused slideBox;
@@ -98,12 +100,12 @@ The animation's keyframes are defined next; they describe an animation which cau
 ```css
 @keyframes slideBox {
   from {
-    left:0;
-    top:0;
+    left: 0;
+    top: 0;
   }
   to {
-    left:calc(100% - var(--boxwidth));
-    top:calc(100% - var(--boxwidth))
+    left: calc(100% - var(--boxwidth));
+    top: calc(100% - var(--boxwidth));
   }
 }
 ```
@@ -116,9 +118,10 @@ Some JavaScript code will need to be written to handle the click on the button t
 var box = document.getElementById("box");
 var iterationCounter = 0;
 
-box.onanimationiteration = function(event) {
+box.onanimationiteration = function (event) {
   box.style.animationPlayState = "paused";
-  document.getElementById("play").innerHTML = "Start Iteration #" + (iterationCounter+1);
+  document.getElementById("play").innerHTML =
+    "Start Iteration #" + (iterationCounter + 1);
 };
 ```
 
@@ -129,10 +132,14 @@ The onanimationiteration event handler is then set up. It simply sets the box's
 Finally, we set up a handler for a click on the button that runs the animation:
 
 ```js
-document.getElementById("play").addEventListener("click", function(event) {
-  box.style.animationPlayState = "running";
-  iterationCounter++;
-}, false);
+document.getElementById("play").addEventListener(
+  "click",
+  function (event) {
+    box.style.animationPlayState = "running";
+    iterationCounter++;
+  },
+  false,
+);
 ```
 
 This sets the box element's {{cssxref("animation-play-state")}} to "running" and increments the iteration counter. That's all there is to it!
diff --git a/files/zh-cn/web/api/element/animationstart_event/index.md b/files/zh-cn/web/api/element/animationstart_event/index.md
index 2bb002ecb5bafa..2bd41a41749c94 100644
--- a/files/zh-cn/web/api/element/animationstart_event/index.md
+++ b/files/zh-cn/web/api/element/animationstart_event/index.md
@@ -22,14 +22,14 @@ slug: Web/API/Element/animationstart_event
 
 ## 属性表
 
-| 属性                                     | 类型                                 | 描述                                                                                                                                                                                                                                        |
-| ---------------------------------------- | ------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `target` {{ReadOnlyInline}}        | {{domxref("EventTarget")}} | 事件来源（DOM 顶层目标）。                                                                                                                                                                                                                  |
-| `type` {{ReadOnlyInline}}          | {{domxref("DOMString")}}     | 事件类型                                                                                                                                                                                                                                    |
-| `bubbles` {{ReadOnlyInline}}       | `boolean`                            | 事件是否正常冒泡？                                                                                                                                                                                                                          |
-| `cancelable` {{ReadOnlyInline}}    | `boolean`                            | 可否取消该事件？                                                                                                                                                                                                                            |
-| `animationName` {{ReadOnlyInline}} | {{domxref("DOMString")}}     | 与该动画相关的 CSS 属性值。                                                                                                                                                                                                                 |
-| `elapsedTime` {{ReadOnlyInline}}   | `Float`                              | 动画运行时长，单位为秒，与直到该事件被触发的时间相一致，不包括任何动画暂停时的时长。此值应为 0 除非 `animation-delay` 是一个负值，这种情况下此值为 (-1 \* {{cssxref("animation-delay")}})，并且动画将直接从此值后的序列开始播放。 |
+| 属性                               | 类型                       | 描述                                                                                                                                                                                                                              |
+| ---------------------------------- | -------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `target` {{ReadOnlyInline}}        | {{domxref("EventTarget")}} | 事件来源（DOM 顶层目标）。                                                                                                                                                                                                        |
+| `type` {{ReadOnlyInline}}          | {{domxref("DOMString")}}   | 事件类型                                                                                                                                                                                                                          |
+| `bubbles` {{ReadOnlyInline}}       | `boolean`                  | 事件是否正常冒泡？                                                                                                                                                                                                                |
+| `cancelable` {{ReadOnlyInline}}    | `boolean`                  | 可否取消该事件？                                                                                                                                                                                                                  |
+| `animationName` {{ReadOnlyInline}} | {{domxref("DOMString")}}   | 与该动画相关的 CSS 属性值。                                                                                                                                                                                                       |
+| `elapsedTime` {{ReadOnlyInline}}   | `Float`                    | 动画运行时长，单位为秒，与直到该事件被触发的时间相一致，不包括任何动画暂停时的时长。此值应为 0 除非 `animation-delay` 是一个负值，这种情况下此值为 (-1 \* {{cssxref("animation-delay")}})，并且动画将直接从此值后的序列开始播放。 |
 
 ## 规范
 
diff --git a/files/zh-cn/web/api/element/append/index.md b/files/zh-cn/web/api/element/append/index.md
index 01a0a2ebf2eec5..00e42c4f9a5469 100644
--- a/files/zh-cn/web/api/element/append/index.md
+++ b/files/zh-cn/web/api/element/append/index.md
@@ -63,7 +63,7 @@ console.log(parent.childNodes); // NodeList [ #text "Some text", <p> ]
 ```js
 var parent = document.createElement("div");
 
-with(parent) {
+with (parent) {
   append("foo");
 }
 // ReferenceError: append is not defined
@@ -77,10 +77,10 @@ with(parent) {
 // Source: https://github.com/jserz/js_piece/blob/master/DOM/Element/append()/append().md
 (function (arr) {
   arr.forEach(function (item) {
-    if (item.hasOwnProperty('append')) {
+    if (item.hasOwnProperty("append")) {
       return;
     }
-    Object.defineProperty(item, 'append', {
+    Object.defineProperty(item, "append", {
       configurable: true,
       enumerable: true,
       writable: true,
@@ -90,11 +90,13 @@ with(parent) {
 
         argArr.forEach(function (argItem) {
           var isNode = argItem instanceof Node;
-          docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
+          docFrag.appendChild(
+            isNode ? argItem : document.createTextNode(String(argItem)),
+          );
         });
 
         this.appendChild(docFrag);
-      }
+      },
     });
   });
 })([Element.prototype, Document.prototype, DocumentFragment.prototype]);
diff --git a/files/zh-cn/web/api/element/attachshadow/index.md b/files/zh-cn/web/api/element/attachshadow/index.md
index 53bfcc6cbbe29f..20e27899cc6035 100644
--- a/files/zh-cn/web/api/element/attachshadow/index.md
+++ b/files/zh-cn/web/api/element/attachshadow/index.md
@@ -88,33 +88,33 @@ class WordCount extends HTMLParagraphElement {
     // 计数器指向元素的父级
     var wcParent = this.parentNode;
 
-    function countWords(node){
-      var text = node.innerText || node.textContent
+    function countWords(node) {
+      var text = node.innerText || node.textContent;
       return text.trim().split(/\s+/g).length;
     }
 
-    var count = 'Words: ' + countWords(wcParent);
+    var count = "Words: " + countWords(wcParent);
 
     // 创建一个 shadow root
-    var shadow = this.attachShadow({mode: 'open'});
+    var shadow = this.attachShadow({ mode: "open" });
 
     // 创建文本节点并向其添加计数器
-    var text = document.createElement('span');
+    var text = document.createElement("span");
     text.textContent = count;
 
     // 将其添加到 shadow root 上
     shadow.appendChild(text);
 
     // 当元素内容发生变化时更新计数
-    setInterval(function() {
-      var count = 'Words: ' + countWords(wcParent);
+    setInterval(function () {
+      var count = "Words: " + countWords(wcParent);
       text.textContent = count;
     }, 200);
   }
 }
 
 // 定义新元素
-customElements.define('word-count', WordCount, { extends: 'p' });
+customElements.define("word-count", WordCount, { extends: "p" });
 ```
 
 ## 规范
diff --git a/files/zh-cn/web/api/element/auxclick_event/index.md b/files/zh-cn/web/api/element/auxclick_event/index.md
index 221401c814fee4..96efefc7940fee 100644
--- a/files/zh-cn/web/api/element/auxclick_event/index.md
+++ b/files/zh-cn/web/api/element/auxclick_event/index.md
@@ -22,22 +22,24 @@ element.onauxclick = functionRef(e);
 在这个例子中我们定义了两个事件处理函数：`onclick` 和 `onauxclick`。前者改变按钮背景的颜色，而后者改变按钮前景（文本）的颜色。您可以通过使用多按钮鼠标尝试演示来查看这两种功能 ([see it live on GitHub](https://mdn.github.io/dom-examples/auxclick/); also [see the source code](https://github.com/mdn/dom-examples/blob/master/auxclick/index.html))。
 
 ```js
-var button = document.querySelector('button');
-var html = document.querySelector('html');
+var button = document.querySelector("button");
+var html = document.querySelector("html");
 
 function random(number) {
   return Math.floor(Math.random() * number);
 }
 
-button.onclick = function() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+button.onclick = function () {
+  var rndCol =
+    "rgb(" + random(255) + "," + random(255) + "," + random(255) + ")";
   button.style.backgroundColor = rndCol;
 };
 
-button.onauxclick = function() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+button.onauxclick = function () {
+  var rndCol =
+    "rgb(" + random(255) + "," + random(255) + "," + random(255) + ")";
   button.style.color = rndCol;
-}
+};
 ```
 
 > **备注：** 如果您使用的是三键鼠标，您会注意到在单击任一非鼠标左键时该 `onauxclick` 处理程序会运行。
diff --git a/files/zh-cn/web/api/element/before/index.md b/files/zh-cn/web/api/element/before/index.md
index 3fbeb86f050085..d2279fbf635c20 100644
--- a/files/zh-cn/web/api/element/before/index.md
+++ b/files/zh-cn/web/api/element/before/index.md
@@ -71,7 +71,7 @@ console.log(parent.outerHTML);
 The `before()` 不能配合 with 声明使用，See {{jsxref("Symbol.unscopables")}} for more information.
 
 ```js
-with(node) {
+with (node) {
   before("foo");
 }
 // ReferenceError: before is not defined
@@ -85,10 +85,10 @@ with(node) {
 // from: https://github.com/jserz/js_piece/blob/master/DOM/ChildNode/before()/before().md
 (function (arr) {
   arr.forEach(function (item) {
-    if (item.hasOwnProperty('before')) {
+    if (item.hasOwnProperty("before")) {
       return;
     }
-    Object.defineProperty(item, 'before', {
+    Object.defineProperty(item, "before", {
       configurable: true,
       enumerable: true,
       writable: true,
@@ -98,11 +98,13 @@ with(node) {
 
         argArr.forEach(function (argItem) {
           var isNode = argItem instanceof Node;
-          docFrag.appendChild(isNode ? argItem : document.createTextNode(String(argItem)));
+          docFrag.appendChild(
+            isNode ? argItem : document.createTextNode(String(argItem)),
+          );
         });
 
         this.parentNode.insertBefore(docFrag, this);
-      }
+      },
     });
   });
 })([Element.prototype, CharacterData.prototype, DocumentType.prototype]);
diff --git a/files/zh-cn/web/api/element/blur_event/index.md b/files/zh-cn/web/api/element/blur_event/index.md
index c0aca0115b501b..4ec3f504c9a3a6 100644
--- a/files/zh-cn/web/api/element/blur_event/index.md
+++ b/files/zh-cn/web/api/element/blur_event/index.md
@@ -24,12 +24,12 @@ slug: Web/API/Element/blur_event
 
 ## 属性
 
-| 属性                                     | 类型                                            | 描述                                         |
-| ---------------------------------------- | ----------------------------------------------- | -------------------------------------------- |
+| 属性                               | 类型                                  | 描述                                         |
+| ---------------------------------- | ------------------------------------- | -------------------------------------------- |
 | `target` {{readonlyInline}}        | {{domxref("EventTarget")}}            | 产生该事件的对象 (DOM 树中最顶级的那个对象). |
-| `type` {{readonlyInline}}          | {{domxref("DOMString")}}                | 事件类型。                                   |
-| `bubbles` {{readonlyInline}}       | {{jsxref("Boolean")}}                    | 该事件是否冒泡。                             |
-| `cancelable` {{readonlyInline}}    | {{jsxref("Boolean")}}                    | 该事件是否可取消默认行为。                   |
+| `type` {{readonlyInline}}          | {{domxref("DOMString")}}              | 事件类型。                                   |
+| `bubbles` {{readonlyInline}}       | {{jsxref("Boolean")}}                 | 该事件是否冒泡。                             |
+| `cancelable` {{readonlyInline}}    | {{jsxref("Boolean")}}                 | 该事件是否可取消默认行为。                   |
 | `relatedTarget` {{readonlyInline}} | {{domxref("EventTarget")}} (DOM 元素) | 无                                           |
 
 ## 事件代理
@@ -40,8 +40,8 @@ slug: Web/API/Element/blur_event
 
 ```html
 <form id="form">
-  <input type="text" placeholder="text input">
-  <input type="password" placeholder="password">
+  <input type="text" placeholder="text input" />
+  <input type="password" placeholder="password" />
 </form>
 ```
 
@@ -49,12 +49,20 @@ slug: Web/API/Element/blur_event
 
 ```js
 var form = document.getElementById("form");
-form.addEventListener("focus", function( event ) {
-  event.target.style.background = "pink";
-}, true);
-form.addEventListener("blur", function( event ) {
-  event.target.style.background = "";
-}, true);
+form.addEventListener(
+  "focus",
+  function (event) {
+    event.target.style.background = "pink";
+  },
+  true,
+);
+form.addEventListener(
+  "blur",
+  function (event) {
+    event.target.style.background = "";
+  },
+  true,
+);
 ```
 
 {{EmbedLiveSample('事件代理')}}