将 jQuery forEach 函数转换为 JavaScript？

Question

我的任务是将 jQuery 函数转换为纯 JavaScript。该函数用于检查元素是否在视口内。如果它在视口内，则使用 data-bglazy 属性并使用该属性的值向该元素添加背景图像样式。需要转换的函数是：$.fn.isInViewport = function() {    var elementTop = $(this).offset().top;    var elementBottom = elementTop + $(this).outerHeight();    var viewportTop = $(window).scrollTop();    var viewportBottom = viewportTop + $(window).height();    return elementBottom > viewportTop && elementTop < viewportBottom;  }; $(window).on('resize scroll', function() {    $('.bgLazy').each(function() {      if ($(this).isInViewport()) {        var lazyImg = $(this).attr('data-bglazy');        $(this).css('background-image', 'url(' + lazyImg + ')');      }    });  });目前我在尝试将上述函数转换为 JavaScript 时所拥有的：function isInViewport(el){    var elementTop = el.offsetTop;    var elementBottom = elementTop + el.offsetHeight;    var viewportTop = window.scrollTop;    var viewportBottom = viewportTop + window.offsetHeight;    return elementBottom > viewportTop && elementTop < viewportBottom;  };    var bgElements = document.querySelectorAll('.bgLazy');    bgElements.forEach(bgElementLoop);    function bgElementLoop(item, index) {      if(item.isInViewport()){        var lazyImg = item.getAttribute('data-bglazy');        item.style.backgroundImage = 'url(' + lazyImg + ')';      }    }    window.addEventListener("resize, scroll", bgElementLoop);我试图弄清楚在尝试将 jQuery 函数转换为 JavaScript 时我搞砸了哪一部分编辑：在阅读了一些评论后，我对视图进行了更改。isInViewport 函数没有改变，但我所做的改变如下：    var bgElements = Array.prototype.slice.call(document.querySelectorAll('.bgLazy'));    bgElements.forEach(bgElementLoop);    function bgElementLoop(item, index) {      if(item.isInViewport(item)){        var lazyImg = item.getAttribute('data-bglazy');        item.style.backgroundImage = 'url(' + lazyImg + ')';      }    }    window.addEventListener("resize", bgElementLoop);    window.addEventListener("scroll", bgElementLoop);