• 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获取宽高的更多相关文章

  1. 原生js获取宽高与jquery获取宽高的方法的关系

    说明:1.因为获取高度的情况跟获取宽度的情况一样,所以以下只说获取宽度的情况.  2.以下所说的所有方法与属性所返回的值都是不带单位的.  3.为了方便说明,以下情况采用缩写表示:  obj -> ...

  2. js 和 jquery 里面几个获取宽高的调查

    罗列下 js 和 jquery 里面获取宽高的方法: obj.offsetWidth = $obj.outerWidth()  // offsetWidth obj.clientWidth = obj ...

  3. 17.在自适应屏幕里通过JQ来获取宽高并赋给需要的

    在自适应屏幕里通过JQ来获取宽高并赋给需要的div. var height = document.documentElement.clientHeight; $(window).height();(同 ...

  4. js/jq宽高的理解与运用

    document:1. 与client相关的宽高document.body.clientWidthdocument.body.clientHeightdocument.body.clientLeftd ...

  5. js各种宽高(1)

    在javascript中操作dom节点让其运动的时候,常常会涉及到各种宽高以及位置坐标等概念,如果不能很好地理解这些属性所代表的意义,就不能理解js的运动原理,同时,由于这些属性概念较多,加上浏览器之 ...

  6. DOM中获取宽高、位置总结

    原生JS 一.文档.窗口的宽高和位置 // 获取屏幕的宽高 window.screen.height | window.screen.width // 屏幕可用工作区宽高 window.screen. ...

  7. js 浏览器 宽高 各种

    常用: JS 获取浏览器窗口大小   // 获取窗口宽度   if (window.innerWidth)   winWidth = window.innerWidth;   else if ((do ...

  8. Js获取宽高度的归纳集锦总结

    首先,先吓唬一下我们的小白们!在js中的描述宽高的可以细分有22种.属性根据不同的兼容性也分为五种 window.innerWidth //除去菜单栏的窗口宽度,与浏览器相关 window.inner ...

  9. Js获取宽高度的归纳总结

    首先,先吓唬一下我们的小白们!在js中的描述宽高的可以细分有22种. window.innerWidth //除去菜单栏的窗口宽度 window.innerHeight//除去菜单栏的窗口高度 win ...

随机推荐

  1. python 附加作业01

    题目1: 画方块 输入样例: 10 a 输出样例: 代码: N=eval(input()) c=input() for i in range(N): for j in range(N): print( ...

  2. HTTP [TCP Retransmission] Continuation or non-HTTP traffic[Packet size limited during capture]

    http://www.xianren.org/blog/net/wireshark-q.html  抓到的包数据中常见的错误..待细看,先记下. tcpdump 抓包后发现,出现大量标题字样显示,不利 ...

  3. shell 并发多进程同时执行

    #!/bin/bash SEND_THREAD_NUM= #设置进程数. tmp_fifofile="/tmp/$$.fifo" # 脚本运行的当前进程ID号作为文件名 mkfif ...

  4. 老李分享:loadrunner的java user脚本开发

    老李分享:loadrunner的java user脚本开发 poptest在性能测试loadrunner的课程里,以web协议为主,同时也讲解其他协议的脚本开发,对于一个性能测试工程师需要掌握一个以上 ...

  5. 高吞吐koa日志中间件

    Midlog中间件 node服务端开发中少不了日志打点,而在koa框架下的日志打点在多进程环境中日志信息往往无法对应上下文,而且在高并发下直接进行写buffer操作(内核调用writev)也会造成内存 ...

  6. nginx反向代理的nginx.conf配置

    下面的配置是nginx.conf的示例 nginx反向代理 就是说把跨域的url通过本地代理的方式,变成同域的请求,如此来解决跨域问题 该配置下 通过http://localhost/html5/路径 ...

  7. 删除 vim 命令

    x 删除当前光标下的字符dw 删除光标之后的单词剩余部分.d$ 删除光标之后的该行剩余部分.dd 删除当前行. c 功能和d相同,区别在于完成删除操作后进入INSERT MODEcc 也是删除当前行, ...

  8. Java 静态代理与动态代理

    代理模式 设想你的项目依赖第三方,但是你需要对其接口做一些数据检验.性能数据记录.异常处理等,合适的方法就是使用设计模式里的代理模式. 代理模式是常用的java设计模式,代理类与委托类有同样的接口,代 ...

  9. jdk1.8新特性,还不知道的朋友还不看看,1.9都快出来了

    一.接口的默认方法 Java 8允许我们给接口添加一个非抽象的方法实现,只需要使用 default关键字即可,这个特征又叫做扩展方法,示例如下:代码如下:interface Formula {     ...

  10. yii2 创建ActiveForm(表单)

    表单的生成表单中的方法    ActiveForm::begin()方法    ActiveForm::end()方法    getClientOptions()方法    其它方法:errorSum ...