未捕获的TypeError:无法读取未定义的属性“parentElement”

Question

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

我的代码按预期工作。基本上，它将eventListener添加到作为锚的所有模式解除按钮中。关闭函数是找到最外层的modal div，并为其提供“hidden”类，该类将其显示设置为none。

它正确地关闭了模态，但在模态关闭后，该错误就会出现。

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);
}

约会。js:61未捕获类型错误：无法读取未定义的属性“parentElement”

在getClosestParentByClass（appoints.js:61）

在CloseAppointWindow（appoints.js:52）

在HTMLDEVELENT。（附件：30）

请给我一些见解，为什么它给我这个错误。

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

Answer 1

您将遇到链上没有父元素的元素，您假定它总是有一个

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

最后，您正在重新创建closest（）

const elem = btn.closest(".appt-modal")