在前端开发中，经常需要获取浏览器窗口的高度和滚动位置来实现一些特定的功能。而使用 jQuery 可以轻松地完成这个任务。
窗口高度
要获取浏览器窗口的高度，我们可以使用 $(window).height() 函数。该函数返回当前窗口可见区域的高度，不包括工具栏和滚动条等非内容区域。
下面是一个示例代码：
$(document).ready(function() {
var windowHeight = $(window).height();
console.log('Window height is: ' + windowHeight);
});上述代码将在页面加载时输出窗口高度到控制台。
滚动位置
要获取当前窗口的滚动位置，我们可以使用 $(window).scrollTop() 函数。该函数返回当前窗口顶部距离文档顶部的距离，即滚动位置。
下面是一个示例代码：
$(window).on('scroll', function() {
var scrollTop = $(window).scrollTop();
console.log('Scroll position is: ' + scrollTop);
});上述代码将在窗口滚动时输出滚动位置到控制台。
综合示例
下面是一个结合了上述两个示例的综合示例代码：
-- -------------------- ---- -------
---------------------------- -
--- ------------ - -------------------
------------------- ------ --- - - --------------
---------------------- ---------- -
--- --------- - ----------------------
------------------- -------- --- - - -----------
---
---上述代码将在页面加载时输出窗口高度，同时在窗口滚动时输出滚动位置到控制台。
总结
使用 jQuery 可以轻松地获取浏览器窗口的高度和滚动位置。我们可以使用 $(window).height() 函数来获取窗口高度，使用 $(window).scrollTop() 函数来获取滚动位置。这些功能在实现一些特定的前端效果、优化网页性能等方面有着广泛的应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/9343
