ff chrome和ie下全局动态定位的异同及全局高度的取法


Posted in Javascript onJune 30, 2014

DTD已声明

IE
document.documentElement.scrollHeight 浏览器所有内容高度 ,document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 浏览器滚动部分高度,document.body.scrollTop 始终为0
document.documentElement.clientHeight 浏览器可视部分高度,document.body.clientHeight 浏览器所有内容高度

FF
document.documentElement.scrollHeight 浏览器所有内容高度 ,document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 浏览器滚动部分高度,document.body.scrollTop 始终为0
document.documentElement.clientHeight 浏览器可视部分高度,document.body.clientHeight 浏览器所有内容高度

Chrome
document.documentElement.scrollHeight 浏览器所有内容高度, document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 始终为0,document.body.scrollTop 浏览器滚动部分高度
document.documentElement.clientHeight 浏览器可视部分高度,document.body.clientHeight 浏览器所有内容高度

DTD未声明

IE
document.documentElement.scrollHeight 浏览器可视部分高度,document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 始终为0,document.body.scrollTop 浏览器滚动部分高度
document.documentElement.clientHeight 始终为0,document.body.clientHeight 浏览器可视部分高度

FF
document.documentElement.scrollHeight 浏览器可视部分高度, document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 始终为0,document.body.scrollTop 浏览器滚动部分高度
document.documentElement.clientHeight 浏览器所有内容高度,document.body.clientHeight 浏览器可视部分高度

Chrome
document.documentElement.scrollHeight 浏览器可视部分高度,document.body.scrollHeight 浏览器所有内容高度
document.documentElement.scrollTop 始终为0,document.body.scrollTop 浏览器滚动部分高度
document.documentElement.clientHeight 浏览器所有内容高度,document.body.clientHeight 浏览器可视部分高度

浏览器所有内容高度即浏览器整个框架的高度,包括滚动条卷去部分+可视部分+底部隐藏部分的高度总和

浏览器滚动部分高度即滚动条卷去部分高度即可视顶端距离整个对象顶端的高度。

DTD声明,指的是浏览器页面载入时候的声明:<!DOCTYPE html public ""....>

声明文档类型html

Javascript 相关文章推荐
js 获取服务器控件值的代码
Mar 05 Javascript
JS实现标签页效果(配合css)
Apr 03 Javascript
ExtJS实现文件下载的方法实例
Nov 09 Javascript
JS实现的自定义右键菜单实例二则
Sep 01 Javascript
AngularJs实现ng1.3+表单验证
Dec 10 Javascript
JS实现的五级联动菜单效果完整实例
Feb 23 Javascript
react实现菜单权限控制的方法
Dec 11 Javascript
详解express + mock让前后台并行开发
Jun 06 Javascript
详解Angular如何正确的操作DOM
Jul 06 Javascript
实例分析Array.from(arr)与[...arr]到底有何不同
Apr 09 Javascript
原生javascript制作贪吃蛇小游戏的方法分析
Feb 26 Javascript
ES6 十大特性简介
Dec 09 Javascript
js从Cookies里面取值的简单实现
Jun 30 #Javascript
jQuery学习总结之jQuery事件
Jun 30 #Javascript
JavaScript 获取任一float型小数点后两位的小数
Jun 30 #Javascript
滚动条响应鼠标滑轮事件实现上下滚动的js代码
Jun 30 #Javascript
jquery实现人性化的有选择性禁用鼠标右键
Jun 30 #Javascript
javascript时间函数大全
Jun 30 #Javascript
js取得html iframe中的元素和变量值
Jun 30 #Javascript
You might like
destoon实现首页显示供应、企业、资讯条数的方法
2014/07/15 PHP
php使用curl获取https请求的方法
2015/02/11 PHP
Javascript typeof 用法
2008/12/28 Javascript
JavaScript 组件之旅(二)编码实现和算法
2009/10/28 Javascript
优化javascript的执行速度
2010/01/23 Javascript
利用js实现在浏览器状态栏显示访问者在本页停留的时间
2013/12/29 Javascript
用js正确判断用户名cookie是否存在的方法
2014/01/28 Javascript
jQuery实现复选框全选/取消全选/反选及获得选择的值
2014/06/12 Javascript
省市二级联动小案例讲解
2016/07/24 Javascript
jquery二级目录选中当前页的css样式
2016/12/08 Javascript
javascript常用的设计模式
2017/02/09 Javascript
微信小程序实现倒计时60s获取验证码
2020/04/17 Javascript
探秘vue-rx 2.0(推荐)
2018/09/21 Javascript
Node.js模拟发起http请求从异步转同步的5种用法
2018/09/26 Javascript
五分钟搞懂Vuex实用知识(小结)
2019/08/12 Javascript
详解Webpack抽离第三方类库以及common解决方案
2020/03/30 Javascript
基于JS实现快速读取TXT文件
2020/08/25 Javascript
elementUI同一页面展示多个Dialog的实现
2020/11/19 Javascript
Python常用正则表达式符号浅析
2014/08/13 Python
python更新列表的方法
2015/07/28 Python
用yum安装MySQLdb模块的步骤方法
2016/12/15 Python
Python配置mysql的教程(推荐)
2017/10/13 Python
Python自定义简单图轴简单实例
2018/01/08 Python
Python退火算法在高次方程的应用
2018/07/26 Python
python selenium执行所有测试用例并生成报告的方法
2019/02/13 Python
pytorch中图像的数据格式实例
2020/02/11 Python
解决python调用自己文件函数/执行函数找不到包问题
2020/06/01 Python
python实现数字炸弹游戏
2020/07/17 Python
施华洛世奇天猫官方旗舰店:SWAROVSKI
2017/04/17 全球购物
Perfume’s Club中文官网:西班牙美妆在线零售品牌
2020/08/24 全球购物
创建精神文明单位实施方案
2014/03/08 职场文书
春节联欢会策划方案
2014/05/16 职场文书
焦裕禄精神心得体会
2014/09/02 职场文书
教师辞职信范文
2015/02/28 职场文书
煤矿百日安全活动总结
2015/05/07 职场文书
司法廉洁教育心得体会
2016/01/20 职场文书