区分innerHeight与clientHeight、innerWidth与clientWidth、scrollLeft与pageXOffset等属性
window对象:
(1)innerHeight属性:窗口中文档显示区域的高度,不包括菜单栏、工具栏等部分。该属性可读可写。
IE不支持该属性,IE中body元素的clientHeight属性与该属性相同。
(2)innerWidth属性:窗口中文档显示区域的宽度,同样不包括边框。该属性可读可写。
IE不支持该属性,IE中body元素的clientWidth属性与该属性相同。
clientHeight与clientWidth属性是只读的。
另外,IE不支持outerWidth、outerHeight属性。
(3)pageXOffset属性:整数只读属性,表示文档向右滚动过的像素数。
IE不支持该属性,使用body元素的scrollLeft属性替代。
(4)pageYOffset属性:整数只读属性,表示文档向下滚动过的像素数。
IE不支持该属性,使用body元素的scrollTop属性替代。
兼容IE与DOM浏览器,如何获取窗口中文档显示区域的宽度及高度,使用?:条件语句,如下:
windows.innerWidth ? windows.innerWidth : document.body.clientWidth;
windows.innerHeight ? windows.innerHeight : document.body.clientHeight;
元素对象:
offsetLeft、offsetTop属性:获取元素相对于文档左上角的坐标位置
区分innerHeight与clientHeight、innerWidth与clientWidth、scrollLeft与pageXOffset等属性的更多相关文章
- innerHeight与clientHeight、innerWidth与clientWidth、scrollLeft与pageXOffset等属性
区分innerHeight与clientHeight.innerWidth与clientWidth.scrollLeft与pageXOffset等属性 标签: innerheight clienthe ...
- 区分总结innerHeight与clientHeight、innerWidth与clientWidth、scrollLeft与pageXOffset等属性
window对象: (1)innerHeight属性:窗口中文档显示区域的高度,不包括菜单栏.工具栏等部分.该属性可读可写. IE不支持该属性,IE中body元素的clientHeight属性与该属性 ...
- clientX/Y pageX/Y offsetX/Y layerX/Y screenX/Y clientHeight innerWidth...
关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...
- innerHeight,clientHeight,offsetHeight,scrollWidth等的区别和用法
要理解这几个属性,首先要搞明白body,documentElement的区别 1.body是DOM对象里的body子节点,即<body>标签2.documentElement是整个节点树的 ...
- style.left offsetLeft offsetwidth clientLeft clientWidth scrollLeft scrollWidth
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- jQuery height() innerHeight() outerHight() width() innerWidth() outerWidth()源码解读
在第二层each,传入的对象以height举例是这样的,{padding:innerHeight,content:height,"":outerHeight} 对它遍历调用func ...
- JavaScript操作DOM的那些坑
js在操作DOM中存在着许多跨浏览器方面的坑,本文花了我将近一周的时间整理,我将根据实例整理那些大大小小的“坑”. DOM的工作模式是:先加载文档的静态内容.再以动态方式对它们进行刷新,动态刷新不影响 ...
- 雷哥带你走进Javascript
javascript复习笔记--------------------------------------------1.概念2.面向对象思想3.作用认识4.引入方式5.执行顺序 变量 1)声明方式 x ...
- clientHeight & clientWidth & offsetHeight & offsetWidth & outerWidth & innerWidth & outerWidth & outerHeight
clientHeight & clientWidth & offsetHeight & offsetWidth MDN https://developer.mozilla.or ...
随机推荐
- IOS Block 反向传值
1.在需要像上一个界面传值的.h 文件实现代理方法 @property (nonatomic, copy) void(^isOpenHandler)(BOOL) ; 2.在执行操作的时候需要江操作的结 ...
- (原)Matlab的svmtrain和svmclassify
转载请注明出处: http://www.cnblogs.com/darkknightzh/p/5554551.html 参考网址: http://www.cnblogs.com/zhangchaoya ...
- 层层递进Struts1(六)自定义转换器
Struts提供的类型转换有限,如果我们强行使用没有的类型转换,则会出现错误,以Date类型为例: org.apache.catalina.core.StandardWrapperValve invo ...
- JDBC学习入门
一.JDBC相关概念介绍 1.1.数据库驱动 这里的驱动的概念和平时听到的那种驱动的概念是一样的,比如平时购买的声卡,网卡直接插到计算机上面是不能用的,必须要安装相应的驱动程序之后才能够使用声卡和网卡 ...
- 配置chrome支持本地(file协议)ajax请求
将html代码拖拽进入chrome通过file协议浏览时,发送的ajax请求本地文件,会报跨域错误. XMLHttpRequest cannot load file:///E:/webs/extJS/ ...
- 关于thinkphp中Hook钩子的解析
在tp框架下的Library/Think 下有一个Hook类,这个是用来以插件形式来实例化类并且执行方法的 static private $tags = array(); 这里有一个 ...
- 在函数中处理html点击事件在标签中增加属性值来解决问题。
- 【在Windows下进行的编程人员,你真的需要学习下Linux】
从业几年,发现好多编程人员,严重依赖UI工具.对一些命令操作,十分的反感.尤其是从事Windows系统中的程序开发的人员.由于微软对开发工具,编程套件的极限优化.开发出更多的 面向UI的开发工具.从V ...
- Oracle 10g体系机构及安全管理《思维导图》
通过学习Oracle数据库后,我对数据库又有了进一步的了解,Oracle数据库 10g体系机构分为 物理和逻辑存储结构. 下面是我对Oracle数据库做的思维导图和笔记 (全屏查看:<思维导图& ...
- Linq to Sql自动生成实体类重名情况的处理
使用Linq to sql自动生成实体类时,如果要生成多个库的实体类,往往会遇到类名重名的情况,也就是表名重名,这样编译会不通过,这种情况下要在自动生成的实体类文件中(.designer.cs后缀)将 ...