如何识别网页中是否存在滚动还得到坐标吗？

编程问答 2022-06-12

问题描述

我有一个网页，需要动态获取页面的滚动坐标。假设一个页面有2个滚动，我应该得到2个滚动坐标。因此，它应该是动态的，具体取决于页面。

.Net 4.7.2/.Net 4.8

解决方法

在普通HTML / JS中执行此操作的三种方法。

首先，您可以使用onscroll HTML属性：

<div id="outer" onscroll="handleScroll(this);">
    Content
    <div id="inner" onscroll="handleScroll(this);">
       Inner Content
    </div>
</div>
<script>
    function handleScroll(y) {
        console.log(y.scrollTop);
    }
</script>

第二，您可以添加一个Javascript事件侦听器：

<div id="outer">
    Content
    <div id="inner">
      Inner Content
    </div>
</div>
<script>
    var outer = document.getElementById("outer");
    outer.addEventListener("scroll",() => console.log(outer.scrollTop));
</script>

第三，您可以使用onscroll JS方法：

<div id="outer">
    Content
    <div id="inner">
      Inner Content
    </div>
</div>
<script>
    let outer = document.getElementById("outer");
    outer.onscroll = () => console.log(outer.scrollTop);
</script>

将elem.scrollLeft用于X坐标，并将elem.scrollTop用于Y坐标。

elementelementjavascriptjquery