列表页倒计时 js

<ul id="countdown-list">
    <li data-endtime="2023-12-31T23:59:59">活动1</li>
    <li data-endtime="2023-11-30T23:59:59">活动2</li>
    <!-- 更多列表项 -->
</ul>

document.addEventListener('DOMContentLoaded', function() {
    const countdownList = document.getElementById('countdown-list');
    const items = countdownList.getElementsByTagName('li');

    function updateCountdown(endTime) {
        const now = new Date().getTime();
        const distance = endTime - now;

        if (distance < 0) {
            return '已结束';
        }

        const days = Math.floor(distance / (1000 * 60 * 60 * 24));
        const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        const seconds = Math.floor((distance % (1000 * 60)) / 1000);

        return `${days}天 ${hours}小时 ${minutes}分钟 ${seconds}秒`;
    }

    function updateAllCountdowns() {
        for (let i = 0; i < items.length; i++) {
            const endTime = new Date(items[i].getAttribute('data-endtime')).getTime();
            items[i].innerHTML = `${items[i].innerText} - 倒计时: ${updateCountdown(endTime)}`;
        }
    }

    setInterval(updateAllCountdowns, 1000);
    updateAllCountdowns(); // 初始化
});