如何创建JavaScript倒计时？

Posted 2023-01-31

我想创建一个javascript实时倒计时。几乎像统计网站一样。enter image description here

我已经创建了html文件，但是我不擅长javascript，因此需要您的帮助。

<table>
            <tbody><tr><td class="counter"><div id="cp1">7,795,022,199</div></td>
                <td class="data_name"><b>Current population</b></td></tr>
            <tr><td class="counter"><div id="cp2">3,931,870,264</div></td>
                <td class="data_name">Current male population <span id="cp4">(50.4%)</span></td></tr>
            <tr><td class="counter"><div id="cp3">3,863,151,936</div></td>
                <td class="data_name">Current female population <span id="cp5">(49.6%)</span></td></tr>
            <tr><td class="counter"><div id="cp6">52,128,438</div></td>
                <td class="data_name">Births year to date</td></tr>
            <tr><td class="counter"><div id="cp7">406,110</div></td>
                <td class="data_name">Births today</td></tr>
            <tr><td class="counter"><div id="cp8">20,311,076</div></td>
                <td class="data_name">Deaths year to date</td></tr>
            <tr><td class="counter"><div id="cp9">158,235</div></td>
                <td class="data_name">Deaths today</td></tr>
            <tr><td class="counter"><div id="cp10">0</div></td>
                <td class="data_name">Net migration year to date</td></tr>
            <tr><td class="counter"><div id="cp11">0</div></td>
                <td class="data_name">Net migration today</td></tr>
            <tr><td class="counter"><div id="cp12">31,817,362</div></td>
                <td class="data_name">Population growth year to date</td></tr>
            <tr><td class="counter"><div id="cp13">247,875</div></td>
                <td class="data_name">Population growth today</td></tr>
        </tbody></table>

我需要设置时间间隔，该数字将自动计数。如一秒钟。我怎样才能做到这一点？我想在我的WordPress博客中使用它。

答案

假设您有一个count function。在这种情况下，您可以使用[

每秒执行一次function

setInterval(count, 1000);

现在，您需要定义count，如下所示：

function count() 
    var items = document.querySelectorAll(".counter > div");
    for (let item of items) item.innerText = (parseInt(item.innerText.replace(/,/g, '')) - 1).toString().replace(/\B(?=(\d3)+(?!\d))/g, ",");