javascript - 在页面加载时，错误，getAll 未定义。我相信它是定义的？

Question

在我的页面加载时，我收到以下错误：Uncaught ReferenceError: getAll is not defined at HTMLDocument.<anonymous>

我正在尝试触发模态。当有人单击“观看视频”按钮时。<div id="modal" class="modal">更改<div id="modal" class="modal is-active">为。

我的Javascript如下：

document.addEventListener('DOMContentLoaded', function () {
  // Modals

  var rootEl = document.documentElement;
  var $modals = getAll('.modal');
  var $modalButtons = getAll('.modal-button');
  var $modalCloses = getAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button');

  if ($modalButtons.length > 0) {
     $modalButtons.forEach(function ($el) {
        $el.addEventListener('click', function () {
          var target = $el.dataset.target;
          openModal(target);
        });
     });
  }

  if ($modalCloses.length > 0) {
     $modalCloses.forEach(function ($el) {
        $el.addEventListener('click', function () {
          closeModals();
        });
     });
  }

  function openModal(target) {
     var $target = document.getElementById(target);
     rootEl.classList.add('is-clipped');
     $target.classList.add('is-active');
  }

  function closeModals() {
     rootEl.classList.remove('is-clipped');
     $modals.forEach(function ($el) {
        $el.classList.remove('is-active');
     });
  }

  document.addEventListener('keydown', function (event) {
     var e = event || window.event;
     if (e.keyCode === 27) {
        closeModals();
        closeDropdowns();
     }
 });
});

我getAll的都链接到 css 类？因此，为什么我相信它们是被定义的？

CodePen 示例

标签： javascripthtml