Question

我想了解为什么我似乎无法将onscroll附加到包含DOM元素的变量。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<div style="height: 1000px"></div>
<script>
  $(document).ready(function() {
    var vbody = document.getElementsByTagName('body');
    vbody.onscroll = function() {
      console.log('scrolling');
    }
  });
</script>
</body>
</html>

此代码不记录任何内容。但是，如果你只是改变

vbody.onscroll

到

window.onscroll

控制台日志＆＃34;滚动＆＃34;当你，好吧，滚动 - 就像它应该的那样。

我做错了什么？我想在body元素中添加一个onscroll事件处理程序，并使其像在示例中使用window.onscroll一样运行。

谢谢。

Answer 1

以下代码为您提供了一个HTMLCollection。

document.getElementsByTagName('body');

您需要使用：

$(document).ready(function() {
  var vbody = document.getElementsByTagName('body')[0];
  vbody.onscroll = function() {
    console.log('scrolling');
  }
});

或者因为你正在使用jQuery，坚持下去：

$(document).ready(function() {
  $("body").scroll(function() {
    console.log('scrolling');
  });
});

Answer 2

更改var vbody = document.getElementsByTagName('body');

到var vbody = document.getElementsByTagName('body')[0];

你需要在末尾添加[0]因为document.getElementsByTagName('body')返回一个数组，你需要单个实体实例。

在关闭特定标记之前，使用JS选择HTML标记

2 个答案: