ビューポートに表示されている要素を確認してください（特定の要素が表示されていない場合は表示されません）

Question

私はスクロール可能なdivを持っていて、スクロールするとdiv内の現在表示されている項目を検出する必要があります。特定の要素がビューポート内にあるかどうかを確認できる多くのソリューションが見つかりました。特定の要素を指定することなく、どの項目が表示されているかを単に示す機能が必要です。この関数は、可視アイテムに特定のクラスがあるかどうかをチェックする必要があり、そのクラス名を持つ要素のどれが表示されるかを示す必要があります。

私は今、この権利を持っている：

function isScrolledIntoView(elem) { 
    var docViewTop = $(window).scrollTop(); 
    var docViewBottom = docViewTop + $(window).height(); 

    var elemTop = $(elem).offset().top; 
    var elemBottom = elemTop + $(elem).height(); 

    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop)); 
} 

ただし、これは特定の要素の可視性に応じてtrueまたはfalseを返します。現在表示されている要素を取得し、その要素を返す関数が必要です。

どうすれば実現できますか？

編集 starkyの答え@私は必要な正確に何ですが、私はまた、要素のデータ属性からデータを取得できるようにする必要があります。 data（）メソッドを追加すると、data（）が関数ではないというエラーが返されます（このメソッドはHTML要素を返すので理解しません）。返される要素の属性にはどうやってアクセスできますか？ jQueryのを使用して

Answer 1

：

$('*').filter(function() { 
    return isScrolledIntoView(this); 
}); 

あなたは要素の任意のセットと一致するワイルドカード*セレクタを変更することができます。たとえば、表示されているボタンのみを表示する場合は、次のように入力します。