document.documentElement和document.body区别以及获取浏览器的宽高
原文：http://www.jb51.net/article/41410.htm
1.区别：
body是DOM对象里的body子节点，即 <body> 标签；
documentElement 是整个节点树的根节点root，即<html> 标签；
2.没使用DTD情况即怪异模式BackCompat下：
代码如下:
使用DTD情况即标准模式CSS1Compat下：
代码如下:
cWidth = document.body.clientWidth;
cHeight = document.body.clientHeight;
sWidth = document.body.scrollWidth;
sHeight = document.body.scrollHeight;
sLeft = document.body.scrollLeft;
sTop = document.body.scrollTop;
}
else { //document.compatMode == "CSS1Compat"
cWidth = document.documentElement.clientWidth;
cHeight = document.documentElement.clientHeight;
sWidth = document.documentElement.scrollWidth;
sHeight = document.documentElement.scrollHeight;
sLeft = document.documentElement.scrollLeft == 0 ? document.body.scrollLeft : document.documentElement.scrollLeft;
sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
}
获取当前页面的滚动条纵坐标：document.documentElement.scrollTop
网页被卷去的高： document.body.scrollTop;
在标准w3c下，document.body.scrollTop恒为0，需要用document.documentElement.scrollTop来代替;
document.documentElement和document.body区别以及获取浏览器的宽高的更多相关文章
- Js怎么获取DOM及获取浏览器的宽高？
在JavaScript中,经常会需要获取document文档元素,是HTML文档对象模型的缩写,HTML DOM 定义了用于 HTML 的一系列标准的对象,以及访问和处理 HTML 文档的标准方法. ...
- JQuery-- 获取元素的宽高、获取浏览器的宽高和垂直滚动距离
* 能够使用jQuery设置尺寸 * .width() width * .innerWidth() width + padding * .outerWidth() width + padding + ...
- js获取浏览器内容宽高（小计）
<SCRIPT LANGUAGE="JavaScript">var s = "";s += "\r\n网页可见区域宽:"+ d ...
- JQ 获取浏览器窗口宽高
$(window).height(); // 浏览器时下窗口可视区域高度 $(document).height(); //浏览器时下窗口文档的高度 $(document.body).height(); ...
- 【转】document.documentElement和document.body的区别
转自:http://www.cnblogs.com/ckmouse/archive/2012/01/30/2332070.html 网页中获取滚动条卷去部分的高度,可以通过 document.body ...
- document.documentElement和document.body的区别
网页中获取滚动条卷去部分的高度,可以通过 document.body.scrollTop 来获取,比如使div跟着滚动条滚动: <div id="div" style=&qu ...
- document.documentElement和document.body区别介绍
document.documentElement和document.body区别介绍 * 区别 body是DOM对象黎明的body子节点,即标签 docummentElement 是整个树的根节点ro ...
- js中document.documentElement 和document.body 以及其属性 clientWidth等
在设计页面时可能经常会用到固定层的位置,这就需要获取一些html对象的坐标以更灵活的设置目标层的坐标,这里可能就会用到document .body.scrollTop等属性,但是此属性在xhtml标准 ...
- 不同浏览器对document.documentElement和document.body的scrollheight ,scrollTop,clientHeight以及判断滚动条是否滚动到页面最底部 【转载】
前段时间学习怎么写一个瀑布流的时候,就接触到document.documentElement和document.body的区别,然后今天查资料的时候看到这篇博客,遂转载记录在此. 两种特殊的文档属性可 ...
随机推荐
- LNMP平滑升级nginx并安装ngx_lua模块教程
#ngx_lua module项目地址 https://github.com/chaoslawful/lua-nginx-module 在LNMP安装包后,重编译nginx,并添加ngx_lua模块 ...
- js中级系列：模块化（转载 学习中。。。。）
从 CommonJS 到 Sea.js https://github.com/seajs/seajs/issues/269 CMD(Common Module Definition) 模块定义规范 h ...
- 为什么选择Handlebars.js
据了解,对于java开发,涉及到页面展示时,比较主流的有两种解决方案: 1. struts2+vo+el表达式. 这种方式,重点不在于struts2,而是vo和el表达式,其基本思想是:根据页面需要的 ...
- leetCode 75.Sort Colors (颜色排序) 解题思路和方法
Given an array with n objects colored red, white or blue, sort them so that objects of the same colo ...
- 如何实现uboot和linux之间的参数传递
参考http://cgxcn.blog.163.com/blog/static/132312422009101133251202/ 参考:http://blog.chinaunix.net/uid-1 ...
- [浪风前端开发]JS获取当前时间戳的方法
由于最近在研究轻交互式web设计,所以整理了下面的东东,仅供分享测试学习交流之用. JavaScript 获取当前时间戳:第一种方法: var timestamp = Date.parse(new D ...
- visualvm远程监控jvm两种配置方法
参考:http://blog.itpub.net/17203031/viewspace-765810 一.Jstatd RMI远程监控方法 VisualVM在监控本地JVM的时候是很方便的.只要应用程 ...
- 【直播预告】7月18日3D游戏引擎免费公开课答疑，參与送C币！
喜讯喜讯! 为了酬谢广大学员.CSDN学院特推出iOS和3D游戏引擎开发免费技术答疑公开课,让您度过一个充实的暑假~ 參与本次公开课,即有机会获得50C币! 答疑公开课时间:7月18日 晚7:30-9 ...
- Intent跳转系统的应用
1.从google搜索内容 Intent intent = new Intent(); intent.setAction(Intent.ACTION_WEB_SEARCH); int ...
- OpenCV学习笔记十八：opencv_flann模块
一,简介: Fast Library for Approximate Nearest Neighbors (FLANN)算法库.