使用Javascript，HTML和CSS的计数器无法正常工作

布赖恩·哈里斯

谁能帮助我获得此（https://jsfiddle.net/hmatrix/v3jncqac/）代码以起作用？

意图：我想创建一个递增的计数器。

我的HTML：

<body onload="incrementCount(10)">
    <div class="main_container" id="id_main_container">
        <div class="container_inner" id="display_div_id">
        </div>
    </div>
</body>

我的JS：

var counter_list = [10,10000,10000];
var str_counter_0 = counter_list[0];
var str_counter_1 = counter_list[1];
var str_counter_2 = counter_list[2];
var display_str = "";
var display_div = document.getElementById("display_div_id");

function incrementCount(current_count){
    setInterval(function(){
        // clear count
        while (display_div.hasChildNodes()) {
            display_div.removeChild(display_div.lastChild);
        }
        str_counter_0++;
        if (str_counter_0 > 99) {
            str_counter_0 = 0; // reset count
            str_counter_1++;    // increase next count
        }
        if(str_counter_1>99999){
            str_counter_2++;
        }
        display_str = str_counter_2.toString() + str_counter_1.toString() + str_counter_0.toString();
        for (var i = 0; i < display_str.length; i++) {
            var new_span = document.createElement('span');
            new_span.className = 'num_tiles';
            new_span.innerText = display_str[i];
            display_div.appendChild(new_span);
        }
    },1000);
}

艾哈迈德·乌尔德（Ahmed Ulde）

    <body onload="incrementCount(10)">
    <div class="main_container" id="id_main_container">
        <div class="container_inner" id="display_div_id">
        </div>
    </div>
</body>
<script>
var counter_list = [10,10000,10000];
var str_counter_0 = counter_list[0];
var str_counter_1 = counter_list[1];
var str_counter_2 = counter_list[2];
var display_str = "";
var display_div = document.getElementById("display_div_id");

function incrementCount(current_count){
    setInterval(function(){
        // clear count
        while (display_div.hasChildNodes()) {
            display_div.removeChild(display_div.lastChild);
        }
        str_counter_0++;
        if (str_counter_0 > 99) {
            str_counter_0 = 0; // reset count
            str_counter_1++;    // increase next count
        }
        if(str_counter_1>99999){
            str_counter_2++;
        }
        display_str = str_counter_2.toString() + str_counter_1.toString() + 
str_counter_0.toString();
        for (var i = 0; i < display_str.length; i++) {
            var new_span = document.createElement('span');
            new_span.className = 'num_tiles';
            new_span.innerText = display_str[i];
            display_div.appendChild(new_span);
        }
    },1000);
}
</script>

JSFIDDLE：https：//jsfiddle.net/v3jncqac/32/

您的onload函数找不到该函数，因为您的js位于其他文件中。您需要在html顶部添加脚本src或如上所述进行操作。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。