jquery - 了解航点基础知识

我正在尝试使用流行的“ Waypoints” jQuery库。我看过各种示例和文档，但是我在努力掌握如何访问附加到航点的元素。

为了清楚起见，我在页面的几个部分中属于.nudgedown类。我想让它们一旦滚动到就改变背景颜色。我正在尝试通过以下代码来提醒它们的初始背景色，以查看是否有任何工作：

$(".nudgedown").waypoint(function(){
    alert($(this).css("background-color"));
});

但是什么也没发生，在控制台中我得到这个错误：


TypeError：b.ownerDocument未定义


我究竟做错了什么？我在方法上是否缺少某些概念？先谢谢您的帮助。

最佳答案

您好，您尝试使用$(this)获取错误的元素。您可以尝试以下方法：

$(document).ready(function(){
	var waypoints = $('.nudgedown').waypoint({
              handler: function(direction) {
              var el=$(this).get(0).element;
              console.log($(el).css("background-color"));
            }
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.0/jquery.waypoints.js"></script>
<div style="background-color:blue; height:50px"></div>
<span class="nudgedown" style="background-color:red;">test</span>
<div style="background-color:green; height:800px"></div>

结果