js获取宽高
- document.body.clientWidth ==> BODY对象宽度
- document.body.clientHeight ==> BODY对象高度
- document.documentElement.clientWidth ==> 可见区域宽度
- document.documentElement.clientHeight ==> 可见区域高度
- 网页可见区域宽: document.body.clientWidth
- 网页可见区域高: document.body.clientHeight
- 网页可见区域宽: document.body.offsetWidth (包括边线的宽)
- 网页可见区域高: document.body.offsetHeight (包括边线的高)
- 网页正文全文宽: document.body.scrollWidth
- 网页正文全文高: document.body.scrollHeight
- 网页被卷去的高: document.body.scrollTop
- 网页被卷去的左: document.body.scrollLeft
- 网页正文部分上: window.screenTop
- 网页正文部分左: window.screenLeft
- 屏幕分辨率的高: window.screen.height
- 屏幕分辨率的宽: window.screen.width
- 屏幕可用工作区高度: window.screen.availHeight
- 屏幕可用工作区宽度: window.screen.availWidth
- // 部分jQuery函数
- $(window).height() //浏览器时下窗口可视区域高度
- $(document).height() //浏览器时下窗口文档的高度
- $(document.body).height() //浏览器时下窗口文档body的高度
- $(document.body).outerHeight(true) //浏览器时下窗口文档body的总高度 包括border padding margin
- $(window).width() //浏览器时下窗口可视区域宽度
- $(document).width()//浏览器时下窗口文档对于象宽度
- $(document.body).width() //浏览器时下窗口文档body的高度
- $(document.body).outerWidth(true) //浏览器时下窗口文档body的总宽度 包括border padding
- HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
- scrollHeight: 获取对象的滚动高度。
- scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
- scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
- scrollWidth:获取对象的滚动宽度
- offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
- offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
- offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
- event.clientX 相对文档的水平座标
- event.clientY 相对文档的垂直座标
- event.offsetX 相对容器的水平坐标
- event.offsetY 相对容器的垂直坐标
- document.documentElement.scrollTop 垂直方向滚动的值
- event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

0.0
js获取宽高的更多相关文章
- 原生js获取宽高与jquery获取宽高的方法的关系
说明:1.因为获取高度的情况跟获取宽度的情况一样,所以以下只说获取宽度的情况. 2.以下所说的所有方法与属性所返回的值都是不带单位的. 3.为了方便说明,以下情况采用缩写表示: obj -> ...
- js 和 jquery 里面几个获取宽高的调查
罗列下 js 和 jquery 里面获取宽高的方法: obj.offsetWidth = $obj.outerWidth() // offsetWidth obj.clientWidth = obj ...
- 17.在自适应屏幕里通过JQ来获取宽高并赋给需要的
在自适应屏幕里通过JQ来获取宽高并赋给需要的div. var height = document.documentElement.clientHeight; $(window).height();(同 ...
- js/jq宽高的理解与运用
document:1. 与client相关的宽高document.body.clientWidthdocument.body.clientHeightdocument.body.clientLeftd ...
- js各种宽高(1)
在javascript中操作dom节点让其运动的时候,常常会涉及到各种宽高以及位置坐标等概念,如果不能很好地理解这些属性所代表的意义,就不能理解js的运动原理,同时,由于这些属性概念较多,加上浏览器之 ...
- DOM中获取宽高、位置总结
原生JS 一.文档.窗口的宽高和位置 // 获取屏幕的宽高 window.screen.height | window.screen.width // 屏幕可用工作区宽高 window.screen. ...
- js 浏览器 宽高 各种
常用: JS 获取浏览器窗口大小 // 获取窗口宽度 if (window.innerWidth) winWidth = window.innerWidth; else if ((do ...
- Js获取宽高度的归纳集锦总结
首先,先吓唬一下我们的小白们!在js中的描述宽高的可以细分有22种.属性根据不同的兼容性也分为五种 window.innerWidth //除去菜单栏的窗口宽度,与浏览器相关 window.inner ...
- Js获取宽高度的归纳总结
首先,先吓唬一下我们的小白们!在js中的描述宽高的可以细分有22种. window.innerWidth //除去菜单栏的窗口宽度 window.innerHeight//除去菜单栏的窗口高度 win ...
随机推荐
- 老李推荐:第2章1节《MonkeyRunner源码剖析》了解你的测试对象: NotePad应用简介
老李推荐:第2章1节<MonkeyRunner源码剖析>了解你的测试对象: NotePad应用简介 本书脚本相关的示例常会用到Android SDK自带的NotePad这个应用,所以这 ...
- EDP转接IC NCS8805:RGB/LVDS转EDP芯片,带Scaler
RGB/LVDS-to-eDP Converter w/ Scaler1 FeaturesEmbedded-DisplayPort (eDP) Output1/2/4-lane eDP @ 1.62/ ...
- Canvas绘制一个大鱼喂小鱼的游戏
Canvas是HTML5中的一部分,强大的API足以让我们绘制我们任意想绘制的东西.利用Canvas的基础学习以及JavaScript面向对象的思想绘制一个小游戏,下面是源码地址https://git ...
- 浩哥解析MyBatis源码(七)——DataSource数据源模块之托管数据源
原创作品,可以转载,但是请标注出处地址:http://www.cnblogs.com/V1haoge/p/6675700.html 1 回顾 之前介绍的非池型与池型数据源都是MyBatis自己定义的内 ...
- 1147: 零起点学算法54——Fibonacc
1147: 零起点学算法54--Fibonacc Time Limit: 1 Sec Memory Limit: 64 MB 64bit IO Format: %lldSubmitted: 20 ...
- Python:generator的send()方法流程分析
先来一个简单地例子: def foo(): print('starting') while True: r = yield 2 print(r) f = foo() print(f.send(None ...
- Linux服务器性能查看分析调优
一 linux服务器性能查看 1.1 cpu性能查看 1.查看物理cpu个数: cat /proc/cpuinfo |grep "physical id"|sort|uniq|wc ...
- 对MySQL数据量日益增长产生的一点小想法
最近一直在想一个问题 MySQL数据量日益庞大,目前单表总记录数有 300W+,导致sql语句执行的速度变慢,如果一直这样增长下去,总有一天会爆炸的.怎么办??怎么办?? 第一:想到的必然是 添加索引 ...
- 在ASP.NET MVC 中获取当前URL、controller、action 、参数
URL的获取很简单,ASP.NET通用:[1]获取 完整url (协议名+域名+虚拟目录名+文件名+参数) string url=Request.Url.ToString(); [2]获取 虚拟目录名 ...
- Web性能优化工具WebPageTest(二)——性能数据
在前一篇<配置>完成后,点击“START TEST”,就可以开始测试,测试需要一段时间. 有时候可能还要排队,如下图所示,测试完成后可查看到测试结果. 一.Summary 1)优化等级 优 ...