วิธีสร้างหรือรีเซ็ต Counter (ตัวนับ) ด้วย JavaScript

ใช้คุณสมบัติ counterReset เพื่อสร้างตัวนับใหม่หรือรีเซ็ตค่าตัวนับเดิมเป็นศูนย์ มักใช้กับ container element ที่จะเริ่มนับใหม่

ตัวอย่าง

<!DOCTYPE html>
<html>
  <head>
    <style>
      h2:before {
        counter-increment: section;
        content: counter(section) " Quiz ";
      }
    </style>
  </head>
  <body>
    <h1>Quizzes</h1>
    <p>Change the counterIncrement</p>
    <h2>Ruby</h2>
    <h2 id="myID">Java</h2>
    <h2>PHP</h2>
    <h2>Perl</h2>
    <button onclick="display()">Reset Counter</button>
    <script>
      function display() {
        document.body.style.counterReset = "section";
      }
    </script>
  </body>
</html>