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 ...
随机推荐
- [UWP]了解模板化控件(2.1):理解ContentControl
UWP的UI主要由布局容器和内容控件(ContentControl)组成.布局容器是指Grid.StackPanel等继承自Panel,可以拥有多个子元素的类.与此相对,ContentControl则 ...
- react+webpack开发环境配置
react是目前非常热门的前端框架,提倡组件化开发.所谓的组件,简单理解,就是一个独立的页面部件(包括页面模版,样式,逻辑等),它是一个独立的整体. webpack,是一个模块打包工具,其主要功能,就 ...
- 深入PHP变量存储结构 标签: PHP存储
1.深入PHP变量存储结构 标签: PHP存储 分类: 编程语言(10) 首先声明,我并没有去读PHP的源码,只是对于PHP的有时候诡异的表现感兴趣,找了一下开发人员laruence的博客结合PH ...
- 【C++】智能指针详解(二):auto_ptr
首先,我要声明auto_ptr是一个坑!auto_ptr是一个坑!auto_ptr是一个坑!重要的事情说三遍!!! 通过上文,我们知道智能指针通过对象去管理指针,在构造对象时完成资源的分配及初始化,在 ...
- MongoDB基础教程系列--第四篇 MongoDB 查询文档
查询文档 查询文档可以用 find() 方法查询全部文档,可以用 findOne() 查询第一个文档,当然还可以根据 条件操作符 和 $type操作符 查询满足条件的文档. find() 和 find ...
- python 自动化接口测试(6)
迎接新的一波更新吧,这次是基于图灵机器人的一个api接口的测试. 这是api的接口:http://www.tuling123.com/openapi/api 我们试着通过浏览器直接访问看下 这是反馈的 ...
- Android Google AdMob 广告接入示例
Android Google AdMob 广告接入示例 [TOC] 首先请大家放心,虽然 Google搜索等服务被qiang了,但是 广告服务国内还是可以用的,真是普天同庆啊~~~噗! 其实这篇文章也 ...
- [个人小工具]清除SVN控制
SVN控制说白了就是在.svn文件夹内把项目文件的信息保存,清除SVN控制其实就是把.svn文件夹删除就可以了.但是如果文件夹太多,总不可能一个个文件夹去删除吧,所以写了个遍历文件夹删除的小工具. R ...
- CSS 画三角形、圆
<div class="square"></div> <style> .square { height: 0px; width: 0px; bo ...
- JS里引用CSS属性时候的命名
如果JS代码中设置<p>元素的另一个CSS属性font-family.这个属性的获取方式与color属性略有不同,因为 font和family之间的连字符与JS中减法操作符相同,J ...