• 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. 疯狂的 JAVA 后++

    一.x++ 所以执行完x++之后,局部变量区的x值,直接为2: iinc: 指定int型变量增加指定的值,注意是变量,我的解释是iinc直接对局部变量操作,而不是对操作栈进行操作! ★★★★ OUTP ...

  2. 虚拟机Linux 的一些基础命令和注释

    cd命令 cd    ==回到初始,主目录 cd -  ==回到上一级目录交替 cd ~ ==回到root家目录 cd .  ==当前目录 cd .. ==进入上一级目录 ls命令 ls     == ...

  3. GDOI2014模拟 旅行【SPFA】

    旅行(travel) 从前有一位旅者,他想要游遍天下所有的景点.这一天他来到了一个神奇的王国:在这片土地上,有n个城市,从1到n进行编号.王国中有m条道路,第i条道路连接着两个城市ai,bi,由于年代 ...

  4. 【Hexo】(一)使用HEXO配置环境,创建Hello World

    现场直播,呵呵,就是我完成一步,就记录一下: 一.配置环境 1.安装 Node 下载地址:Node.js 2.安装 Git(win环境下) 下载地址:Git Git 绑定 GitHub账户: ①打开G ...

  5. 手机自动化测试:appium源码分析之bootstrap十二

    手机自动化测试:appium源码分析之bootstrap十二   poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣 ...

  6. 老李分享:jvm结构简介 1

    老李分享:jvm结构简介     poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家咨询qq:9088214 ...

  7. H5与Android之间的交互

    关于Android与JS网页端的交互,网上有很多教程,刚做这功能,参考了多方资料,最终出来后觉得简单,但是为实现的话有诸多小问题,最终效果如下: 现在简单整理一下:(直接贴代码,注释详细,应该能懂的) ...

  8. Java并发编程:如何创建进程?

    转载自:http://www.cnblogs.com/dolphin0520/p/3913517.html 在前面一篇文章中已经讲述了在进程和线程的由来,今天就来讲一下在Java中如何创建线程,让线程 ...

  9. 将 JSP 中数组传递给 js

    <%       String[]  name   =   { "w ", "a ", "n ", "g"}; % ...

  10. [Python]peewee使用经验

    peewee 使用经验 本文使用案例是基于 python2.7 实现 以下内容均为个人使用 peewee 的经验和遇到的坑,不会涉及过多的基本操作.所以,没有使用过 peewee,可以先阅读文档 正确 ...