我发现很多已回答的问题与我的问题类似，但所有这些问题中的元素实际上都是“未定义的”。就我而言，它存在。

我的代码按预期工作。基本上，它将事件侦听器添加到所有作为锚点的模式关闭按钮。关闭函数是找到最外层的模式 div 并为其赋予“隐藏”类，将其显示设置为无。

它正确关闭了模式，但在模式关闭后，该错误出现。

const bookBTN =             document.getElementById('bookBTN');
const apptModalStart =      document.getElementById('appt-start');
const apptModalEnd =        document.getElementById('appt-end');
const apptStartContent =    apptModalStart.querySelector('.appt-content');
const apptEndContent =      apptModalEnd.querySelector('.appt-content');
const modalCloseBTNs =      document.querySelectorAll('.modal-dismiss');

for(let i = 0; i < modalCloseBTNs.length; i++) {
    modalCloseBTNs[i].addEventListener('click', function(e) {
        closeAppointmentWindow(modalCloseBTNs[i]);
    })
}

const closeAppointmentWindow = (btn) => {
    let parent = getClosestParentByClass(btn, "appt-modal");  // Line 52
    parent.classList.add('faded');
    if(parent === apptModalStart) showBTN(bookBTN);
    setTimeout(function() {
        parent.classList.add('hidden');
    }, 300);
}

const getClosestParentByClass = (e, parentClass) => {
    let parent = e.parentElement;  // Line 61
    if(e.parentElement.classList.contains(parentClass)) return parent;
    else return getClosestParentByClass(parent, parentClass);
}

appointments.js:61 Uncaught TypeError: Cannot read property 'parentElement' of undefined

at getClosestParentByClass (appointments.js:61)

at closeAppointmentWindow (appointments.js:52)

at HTMLDivElement. (appointments.js:30)

请告诉我为什么会出现该错误。

编辑：我已经在循环中拥有 console.log(modalCloseBTNs)、console.log(modalCloseBTNs[i])，在每个函数中分别拥有 console.log(e) 和 console.log(btn)，并且它们都已定义。除了 btn 和 e，它们每个显示 2 个版本，一个是在函数完成后立即定义的，第二个版本（这暗示它运行了 2 次？？？由于某种原因）未定义。