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的区别,然后今天查资料的时候看到这篇博客,遂转载记录在此. 两种特殊的文档属性可 ...
随机推荐
- 459. Repeated Substring Pattern【easy】
459. Repeated Substring Pattern[easy] Given a non-empty string check if it can be constructed by tak ...
- mysql workbench 导出表结构
Server->Data Export 选择数据库(我的是 lhc库) -> 选择对应表(我的是 device表), Dump Structre and Data 导出表数据和表结构 D ...
- 基于AFNetworking的网络判断【原创】
首先导入AFNetworking第三方框架,然后将下面的.h和.m放在你新建的类中便可 GGNetworkJudge.h 在最后会有Singleton.h头文件代码 #import <Fou ...
- Xcode7中你一定要知道的炸裂调试神技【转载】
Xcode7中苹果为我们增加了两个重要的debug相关功能.了解之后觉得非常实用,介绍给大家. 1.Address Sanitizer: 妈妈再也不用担心 EXC_BAD_ACCESS EXC_BAD ...
- consul eureka区别(来自Consul官网)
consul 与 eureka Eureka是一个服务发现工具.该体系结构主要是客户端/服务器,每个数据中心有一组Eureka服务器,通常每个可用区域一个.通常Eureka的客户使用嵌入式SDK来注册 ...
- 有向图 加最少的边 成为强连通分量的证明 poj 1236 hdu 2767
poj 1236: 题目大意:给出一个有向图, 任务一: 求最少的点,使得从这些点出发可以遍历整张图 任务二: 求最少加多少边 使整个图变成一个强连通分量. 首先任务一很好做, 只要缩点 之后 求 ...
- 基于jQuery表格增加删除代码示例
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Sql server还原失败(数据库正在使用,无法获得对数据库的独占访问权)
Sql server还原失败(数据库正在使用,无法获得对数据库的独占访问权) 问题分析:数据库还原的时候还有其他进程连在上面,导致无法获得独占造成的. 解决方案: 一.切断连接进程 .查询要还原的数据 ...
- kali linux下更新163源可使用RPM
在没有安装163源之前 更新163源 1.在终端输入#leafpad /etc/apt/sources.list 2.打开网页 http://mirrors.163.com/.help/debian. ...
- Android开发:《Gradle Recipes for Android》阅读笔记(翻译)2.4——更新新版本的Gradle
问题: 你需要更新应用的Gradle版本. 解决方案: 生成一个新的wrapper,或者直接修改属性文件(.properties). 讨论: Android Studio包含了一个Gradle的分发. ...