HTML DOM Style counterIncrement प्रॉपर्टी

HTML DOM Style counterIncrement प्रॉपर्टी का उपयोग एक या अधिक CSS काउंटर के मान को बढ़ाने या घटाने के लिए किया जाता है। इसका उपयोग आमतौर पर counterReset और content प्रॉपर्टी के साथ मिलकर किया जाता है।

सिंटैक्स निम्नलिखित है:

counterIncrement प्रॉपर्टी सेट करना:

object.style.counterIncrement = "none|id|initial|inherit"

उपरोक्त प्रॉपर्टी मान निम्नलिखित हैं:

आइए counterIncrement प्रॉपर्टी के लिए एक उदाहरण देखें:

उदाहरण

<!DOCTYPE html> <html> <head> <style>    ul {       counter-reset: demo_var;    }    li::after {       counter-increment: demo_var 10;       content: " " counter(demo_var) ".";    } </style> <script>    function incrementCounterVal(){       document.getElementsByTagName("li")[0].style.counterIncrement="demo_var 2";       document.getElementById("Sample").innerHTML="काउंटर इंक्रीमेंट मान अब 2 से बढ़ गया है"; } </script> </head> <body>    <ul>       <li>Demo =</li>       <li>Demo =</li>       <li>Demo =</li>       <li>Demo =</li>       <li>Demo =</li>       <li>Demo =</li>    </ul>    <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त लिस्ट काउंटर इंक्रीमेंट मान बढ़ाएं</p>    <button onclick="incrementCounterVal()">काउंटर मान बढ़ाएं</button>    <p id="Sample"></p> </body> </html>

आउटपुट

काउंटर मान बढ़ाएं बटन पर क्लिक करने पर: