根据窗口位置获取元素

Question

[我要完成的工作：当将任何具有“ yes”类的元素滚动到窗口中的特定Y位置（为了简单起见，我们假装它是窗口的顶部），我只是想要获取该元素，以便我可以获取其某些属性。

<div class="container">
  <div class="no"></div>
  <div class="yes"></div>
  <div class="yes"></div>
  <div class="yes"></div>
  <div class="yes"></div>
  <div class="no"></div>
</div>

我已经尝试了这两种方法，也尝试了第一种方法[[works，但是它似乎效率很低，因为在滚动过程中必须不断评估元素的位置[[all”。可能有很多。但是也许我高估了它的效率如何？

方法1：

$el = $('.yes');
$el.each(function(){
  var distance = $(this).offset().top;
  $window.scroll(function() {
    if ( $window.scrollTop() >= distance ) {
      // get the stuff
    }
  });
});

另一种方法似乎更有效（但可能不是吗？），但我没有使它能够按需工作：

$window.scroll(function(){
    var el = document.elementsFromPoint(0, 0);
    var $el = $(el);
    if($el.hasClass('yes')){
        //get the stuff
    }
});

这似乎根本无法正常工作。拾取一些子元素“ .yes”元素，即使这些元素本身没有“ yes”类，也根本无法拾取其他“ .yes”元素。我不知道为什么

[进行位置测试，使其达到最佳效果）。

Answer 1

here is mozilla's documentation on the intersection/observer API。