jQuery窗口、文档、网页各种高度的精确理解


Posted in Javascript onJuly 02, 2014

$(document).height():整个网页的高度
$(window).height():浏览器可视窗口的高度
$(window).scrollTop():浏览器可视窗口顶端距离网页顶端的高度(垂直偏移)

用一句话理解就是:当网页滚动条拉到最低端时,$(document).height() == $(window).height() + $(window).scrollTop()。

当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()。

不建议使用$("html").height()、$("body").height()这样的高度。

原因:

$("body").height():body可能会有边框,获取的高度会比$(document).height()小;
$("html").height():在不同的浏览器上获取的高度的意义会有差异,说白了就是浏览器不兼容。
$(window).height()值有问题,返回的不是浏览器窗口的高度?

Javascript 相关文章推荐
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
Dec 22 Javascript
SyntaxHighlighter代码加色使用方法
Sep 07 Javascript
用JQuery 实现AJAX加载XML并解析的脚本
Jul 25 Javascript
jquery中.add()的使用分析
Apr 26 Javascript
javascript中call apply 的应用场景
Apr 16 Javascript
jQuery实现简单弹窗遮罩效果
Feb 27 Javascript
JS图片延迟加载插件LazyImgv1.0用法分析【附demo源码下载】
Sep 04 Javascript
微信小程序数据存储与取值详解
Jan 30 Javascript
vue安装和使用scss及sass与scss的区别详解
Oct 15 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【凹多边形的分离轴检测算法】
Dec 13 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
vue使用axios实现excel文件下载的功能
Jul 16 Javascript
JS实现鼠标经过好友列表中的好友头像时显示资料卡的效果
Jul 02 #Javascript
jquery序列化表单以及回调函数的使用示例
Jul 02 #Javascript
IE8下Jquery获取select选中的值post到后台报错问题
Jul 02 #Javascript
js面向对象编程之如何实现方法重载
Jul 02 #Javascript
jquery.validate.js插件使用经验记录
Jul 02 #Javascript
escape编码与unescape解码汉字出现乱码的解决方法
Jul 02 #Javascript
js获取IP地址的方法小结
Jul 01 #Javascript
You might like
escape unescape的php下的实现方法
2007/04/27 PHP
PHP操作文件类的函数代码(文件和文件夹创建,复制,移动和删除)
2011/11/10 PHP
探讨GDFONTPATH能否被winxp下的php支持
2013/06/21 PHP
编写Smarty插件在模板中直接加载数据的详细介绍
2013/06/26 PHP
PHP中加密解密函数与DES加密解密实例
2014/10/17 PHP
php基于双向循环队列实现历史记录的前进后退等功能
2015/08/08 PHP
php命令行模式代码实例详解
2021/02/26 PHP
JS解密入门 最终变量劫持
2008/06/25 Javascript
javascript 获取页面的高度及滚动条的位置的代码
2010/05/06 Javascript
javascript实现输出指定行数正方形图案的方法
2015/08/03 Javascript
mvvm双向绑定机制的原理和实现代码(推荐)
2016/06/07 Javascript
全面理解JavaScript中的继承(必看)
2016/06/16 Javascript
jQuery EasyUI封装简化操作
2016/09/18 Javascript
利用Node.js制作爬取大众点评的爬虫
2016/09/22 Javascript
jquery+html仿翻页相册功能
2016/12/20 Javascript
浅谈javascript中的数据类型转换
2016/12/27 Javascript
JavaScript requestAnimationFrame动画详解
2017/09/14 Javascript
javascript与PHP动态往类中添加方法对比
2018/03/21 Javascript
vue的常用组件操作方法应用分析
2018/04/13 Javascript
浅谈vue项目如何打包扔向服务器
2018/05/08 Javascript
js 实现ajax发送步骤过程详解
2019/07/25 Javascript
Vue-Cli项目优化操作的实现
2019/10/27 Javascript
在Vue mounted方法中使用data变量详解
2019/11/05 Javascript
支付宝小程序实现省市区三级联动
2020/06/21 Javascript
在vue-cli3中使用axios获取本地json操作
2020/07/30 Javascript
Vue+Bootstrap收藏(点赞)功能逻辑与具体实现
2020/10/22 Javascript
Python 获取命令行参数内容及参数个数的实例
2019/12/20 Python
DHC中国官方购物网站:日本通信销售No.1化妆品
2016/08/20 全球购物
英国女鞋购物网站:Moda in Pelle
2019/02/18 全球购物
初中高效课堂实施方案
2014/02/26 职场文书
公路绿化方案
2014/05/12 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
工资收入证明样本(5篇)
2014/09/16 职场文书
实习协议书
2015/01/27 职场文书
求职信内容一般写什么?
2015/03/20 职场文书
求职自荐信该如何书写?
2019/06/24 职场文书