什么是scrollTop属性？
在某些情况下，“元素中的内容”的高度会超过“元素本身”的高度。
在下面的演示中，外部元素的高度是200像素，内部元素的高度是300像素。显然，“外层元素中的含量”高于“外层元素”本身。向下拖动滚动条，部分内容会消失在“外部元素的上边界”之外，scrollTop等于这部分“不可见内容”的高度。演示：(拖动滚动条查看scrollTop的值的变化)这些单词显示在内部元素中。scrollTop值为：这些单词显示在内部元素中。
【Ctrl A all-in注意：外部Js的引入需要刷新页面才能执行】说明：内部元素的高度值是300px，外部元素的高度值是200px，所以外部元素(也就是内部元素)的内容无法完全显示，外部元素的溢出设置为auto，所以在外部元素的右侧会出现一个上下滑动条。在初始状态下，“内元上界”和“外元上界”重合，没有任何东西超出“外元上界”。此时，scrollTop属性的值为0。向下拖动滚动条，超出“外部元素上边界”的内容会逐渐增加，scrollTop值等于这些超出的部分。滚动条拖动到底部时，内部元素的下边界和外部元素的下边界重合，超出外部元素上边界的内容高度=300px-200px=100px，这就是此时的scrollTop值。通过js代码读写scrollTop的值。注意：scrollTop在element.scrollTop中使用，而不是element.style.scrollTop通过js代码读取scrollTop的值。在上面的演示示例中，实际上已经使用了scrolltop读取操作。具体来说，在拖动滚动条的过程中，此时scrollTop的值会被读取并显示在下面的文本中。以上演示示例的完整源代码：这些单词显示在内部元素中。scrollTop的值是：
【Ctrl A Select All注意：外部Js的引入需要刷新页面才能执行】说明：拖动“外部元素滚动条”时，会产生onscroll事件。为此事件注册一个名为Read scrollTop value的处理程序并显示它。在这个事件处理程序中，通过outer element _div.scrollTop获取当时“outer element”的scrollTop的值，并显示在页面上。通过js代码设置scrollTop的值，对上面的演示示例做一些修改。添加函数：通过js语句设置scrollTop的值。示例：这些单词显示在内部元素中。scrollTop的值是：设置scrollTop为50，scrollTop为500。输入scrollTop的值：确定上面演示例子的完整源代码：这些单词显示在inner元素中。scrollTop的值是：
将scrollTop设置为50，将scrollTop设置为500。
输入scrollTop的值：ok。
[Ctrl A全选注：引入外部射流研究…需再刷新一下页面才能执行]解释：形如div_外层元素A.scrollTop=12345的赋值语句会触发onscroll事件，使得读取滚动顶部的值并显示出来函数执行一次上一个例子中已经提到：当拖动滚动条到最底部时，scrollTop=300px-200px=100px，这是滚动顶部能够取的最大值。当用更大的值赋给滚动顶部时，滚动条会自动把它转变为100。例如上面的"把滚动顶部设为500"按钮，滚动条会把500转变为100。得到身体元素的陀螺体元素的滚动顶部是超出"浏览器窗口上边界"的内容的高度当超文本标记语言文档头部包含有"文档类型声明"时，需要用文档。文档元素。滚动顶部获得正确的值，而医生。身体。滚动顶部的值为0 复制代码代码如下：DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www。w3。org/TR/XHTML 1/DTD/XHTML 1-过渡。' DTD '脚本类型=' text/JavaScript '警报('文档。文档元素。顶部滚动：'文档。文档元素。'滚动顶部/'正确的值' '文档。身体。顶部滚动：'文档。身体。'滚动顶部//'值为0' );/脚本当超文本标记语言文档头部不包含任何"文档类型声明"时，需要用医生。身体。滚动顶部获得正确的值，而文档。文档元素。滚动顶部的值为0 下面定义的get_scrollTop_of_body()方法可以处理这种差异复制代码代码如下：函数get _ scroll top _ of _ body(){ var scroll top；如果(窗口类型。页面偏移！='未定义'){ scroll top=window。页面yo偏移量；} else if(文档类型。兼容模式！='未定义'文档。compatmode！=' back compat '){ scroll top=文档。文档元素。滚动顶部；} else if(typeof document.body！='未定义'){ scroll top=document。身体。滚动顶部；}返回scrollTop}
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。