我在商品分类页的JavaScript代码上碰到了问题。原本想实现一个类似亚马逊风格的配送倒计时功能：提示用户“在指定时间内下单，就能在对应日期收到商品”，还要排除节假日和非工作日的情况。但一开始用getElementById的时候，页面上只有第一个元素能正常显示倒计时内容；查资料后改成用类选择器处理多个元素，结果现在整个脚本都不工作了😥

下面是我当前的代码：

HTML部分 #

<div class="delivery-text">Super fast delivery available</div>

JavaScript部分 #

function isHoliday(date) {
    const holidays = [
        new Date(2024, 0, 1), // New Year's Day
        new Date(2024, 3, 7), // Good Friday
        new Date(2024, 3, 10), // Easter Monday
        new Date(2024, 4, 1), // Early May Bank Holiday
        new Date(2024, 4, 8), // King Charles Coronation
        new Date(2024, 4, 29), // Spring Bank Holiday
        new Date(2024, 7, 28), // Summer Bank Holiday
        new Date(2024, 11, 25), // Christmas Day
        new Date(2024, 11, 26), // Boxing Day
    ];

    for (let i = 0; i < holidays.length; i++) {
        if (date.getFullYear() === holidays[i].getFullYear() &&
                date.getMonth() === holidays[i].getMonth() &&
                date.getDate() === holidays[i].getDate()) {
            return true;
        }
    }
    return false;
}

function isBusinessDay(date) {
    const dayOfWeek = date.getUTCDay();
    return dayOfWeek > 0 && dayOfWeek < 6;
}

function nextBusinessDay(date) {

    let nextDay = new Date(date);
    nextDay.setUTCDate(date.getUTCDate() + 1);

    while (!isBusinessDay(nextDay) || isHoliday(nextDay)) {
        nextDay.setUTCDate(nextDay.getUTCDate() + 1);
    }

    return nextDay;
}

function countdownToDispatch() {

    const now = new Date();
    let dispatchDate;

    // 若当前是工作日、非节假日且早于14点，配送截止日为当天
    if (now.getUTCHours() < 14 && isBusinessDay(now) && !isHoliday(now)) {
        dispatchDate = new Date(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), 14, 0, 0, 0);
    } else {
        dispatchDate = nextBusinessDay(now);
        dispatchDate.setUTCHours(14, 0, 0, 0);
    }

    const timeUntilDispatch = dispatchDate.getTime() - now.getTime();
    const days = Math.floor(timeUntilDispatch / (1000 * 60 * 60 * 24));
    const hours = Math.floor((timeUntilDispatch % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    const minutes = Math.floor((timeUntilDispatch % (1000 * 60 * 60)) / (1000 * 60));
    const seconds = Math.floor((timeUntilDispatch % (1000 * 60)) / 1000);

    let timeString = '';

    if (days > 0) {
        timeString += days + ' days ';
    }
    if (hours > 0) {
        timeString += hours + ' hours ';
    }
    if (minutes > 0) {
        timeString += minutes + ' minutes ';
    }
    if (seconds > 0) {
        timeString += seconds + ' seconds ';
    }

    return timeString.trim();
}

function setOrderArrivalDate() {
    const now = new Date();

    let dispatchDate;
    if (now.getUTCHours() < 14 && isBusinessDay(now) && !isHoliday(now)) {
        dispatchDate = now;
    } else {
        dispatchDate = nextBusinessDay(now);
    }

    const arrivalDate = nextBusinessDay(dispatchDate);
    let result = countdownToDispatch();

    const formattedDate = arrivalDate.toLocaleDateString("en-GB", {
        weekday: 'long',
        day: 'numeric',
        month: 'long'
    });

    const finalArrivalDateString = formattedDate.split(' ')[0] + ' ' + ordinalSuffix(arrivalDate.getUTCDate()) + ' ' + formattedDate.split(' ')[2];
    // 注释掉的原id选择器代码
    // const deliveryText = document.getElementById('delivery-text');
    const deliveryText = document.getElementsByClassName("delivery-text");
    // 也曾尝试过querySelectorAll
    // const deliveryText = document.querySelectorAll('.delivery-text');
    deliveryText.textContent = 'Order within the next ' + result + ' to receive your order on ' + finalArrivalDateString;

}

function ordinalSuffix(i) {
    const j = i % 10, k = i % 100;
    if (j == 1 && k != 11) {
        return i + "st";
    }
    if (j == 2 && k != 12) {
        return i + "nd";
    }
    if (j == 3 && k != 13) {
        return i + "rd";
    }
    return i + "th";
}

setInterval(setOrderArrivalDate, 1000);

我尝试过用getElementsByClassName和querySelectorAll来获取所有.delivery-text元素，但不管用哪个，都没法更新元素的文本内容。有没有大佬能帮我排查一下问题出在哪里呀？

备注：内容来源于stack exchange，提问作者newbiewebdev