<progress id="progress1" value="0" max="10"></progress>
<output id="output1"></output>

<script>
    let count = 10;
    let timeoutId = null;
	
    function countdown() {
        document.getElementById('progress1').value = count;
        document.getElementById('output1').value = count + '秒';
        
        if (count <= 0) {
            clearTimeout(timeoutId);
        }
        
        count--;
    }

    timeoutId = setInterval(countdown, 1000);
</script>
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.