区分总结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是整个节点树的 ...
- jQuery height() innerHeight() outerHight() width() innerWidth() outerWidth()源码解读
在第二层each,传入的对象以height举例是这样的,{padding:innerHeight,content:height,"":outerHeight} 对它遍历调用func ...
- style.left offsetLeft offsetwidth clientLeft clientWidth scrollLeft scrollWidth
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 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 ...
随机推荐
- WinForm下窗体标题栏上有“帮助”按钮
将FormBorderStyle设置为Sizable. 最大化和最小化设置为false helpbutton 设置为true
- CodeForces 656B
C - C Time Limit:2000MS Memory Limit:65536KB 64bit IO Format:%I64d & %I64u Submit Status ...
- RequiredFieldValidator 控件 CompareValidator 控件
RequiredFieldValidator 控件 验证关联控件非空 ControlToValidate 属性用来关联被验证控件 ErrorMEssage 触发控件后显示的错误信息 CompareVa ...
- 矩阵连乘积 ZOJ 1276 Optimal Array Multiplication Sequence
题目传送门 /* 题意:加上适当的括号,改变计算顺序使得总的计算次数最少 矩阵连乘积问题,DP解决:状态转移方程: dp[i][j] = min (dp[i][k] + dp[k+1][j] + p[ ...
- POJ2486 Apple Tree(树形DP)
题目大概是一棵树,每个结点都有若干个苹果,求从结点1出发最多走k步最多能得到多少个苹果. 考虑到结点可以重复走,容易想到这么个状态: dp[u][k][0]表示在以结点u为根的子树中走k步且必须返回u ...
- HDU2222 Keywords Search(AC自动机模板)
AC自动机是一种多模式匹配的算法.大概过程如下: 首先所有模式串构造一棵Trie树,Trie树上的每个非根结点都代表一个从根出发到该点路径的字符串. 然后每个结点都计算出其fail指针的值,这个fai ...
- 【BZOJ】2820: YY的GCD(莫比乌斯)
http://www.lydsy.com/JudgeOnline/problem.php?id=2820 此题非常神! 下文中均默认n<m 首先根据bzoj1101的推理,我们易得对于一个数d使 ...
- Contest Hunter Round #70 - 连续两大交易事件杯省选模拟赛
orz lydrainbowcat [Problem A]「艦これ市」70万幕后交易事件 排序机器=-=.重要的是相同的处理. 我们可以从小到大添加数字,然后维护一个位置的序列.每一种相等的数字都在一 ...
- pygame系列_百度随心听_完美的UI设计
这个程序的灵感来自于百度随心听 下面是我的程序截图: 说明: 动作按钮全部是画出来的,没有用到任何图片 用到图片的只有:背景,歌手图片,作者图片 代码正在调试中.... 如果你鼠标移动到黄色小圆里面, ...
- Qt5 和 Qt4 的一些改动和不同
Qt5从Qt4升级后,很多原来Qt4中定义的函数或者变量由于种种原因在Qt5中被遗弃,所以用Qt5来编译Qt4的一些工程项目时,难以避免的会需要修改一些地方,下面就罗列一些我遇到的一些需要修改的地方: ...