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的区别,然后今天查资料的时候看到这篇博客,遂转载记录在此. 两种特殊的文档属性可 ...
随机推荐
- jquery的val()
jQuery 属性操作 - val() 方法 jQuery 属性操作参考手册 实例 设置输入域的值: $("button").click(function(){ $(": ...
- Power Network - poj 1459 (最大流 Edmonds-Karp算法)
Time Limit: 2000MS Memory Limit: 32768K Total Submissions: 24788 Accepted: 12922 Description A ...
- nc 查看端口是否 联通
nc 47.9.16.1 3306 如果卡住,说明 该IP的这个端口 访问不通, 防火墙拦截了
- ActiveMQ部署步骤和后台管理网站Service Unavailable问题解决笔记
最近部署ActiveMQ的时候,发现有的服务器可以打开后台管理网址,有的服务器无法打开,Jetty报503 Service Unavailable. 搞了很久终于发现了问题,现将部署和解决过程做笔记如 ...
- 在Amazon cloud 升级CentOS5.4 到 5.9
升级前一定要备份重要资料,做好最坏的打算,最好的准备! 老板不知道为什么,喜欢升级服务器,劝过好几次都坚持要升级. 好吧,you are boss. 升级前当然免不了google一番.发现CentOS ...
- Python：简述 线程、进程和协程
Python线程 定义:Threading用于提供线程相关的操作,线程是应用程序中工作的最小单元. #!/usr/bin/env python # -*- coding:utf-8 -*- impor ...
- 输入一个十进制数N，将它转换成R进制数输出（运用递归实现）
#include<stdio.h> int cnt=0; //用来记录每个进制存放的位置 char num[20]; //用来存 ...
- 使用spring+quartz配置多个定时任务
Spring被用在了越来越多的项目中, quartz也被公认为是比较好用的定时器设置工具, 在这里通过一个demo说明如何使用spring和quartz配置多个定时任务. 环境: eclipse + ...
- Bootstrap（Web前端CSS框架）
官方定义: Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile fi ...
- 第一次打开Pycharm如何操作？
1.第一次打开pycharm的界面: 2.一些pycharm的选择: 3.上一步,红字4的位置,点击进去,对下面界面进行选择,也就是选择System Interpreter解释器,然后对Interpr ...