• 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. ElasticSearch Index API && Mapping

    ElasticSearch  NEST Client 操作Index var indexName="twitter"; var deleteIndexResponse = clie ...

  2. 【LeetCode题解】排序

    1. 排序 排序(sort)是一种常见的算法,把数据根据特定的顺序进行排列.经典的排序算法如下: 冒泡排序(bubble sort) 插入排序(insertion sort) 选择排序(selecti ...

  3. jquery判断邮箱对错

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 使用python解数独

    偶然发现linux系统附带的一个数独游戏,打开玩了几把.无奈是个数独菜鸟,以前没玩过,根本就走不出几步就一团浆糊了. 于是就打算借助计算机的强大运算力来暴力解数独,还是很有乐趣的. 下面就记录一下我写 ...

  5. Java将一个目录下的所有数据复制到另一个目录下

    /* 将"C:\\JavaProducts\\Source"下的所有数据复制到"C:\\Target"下 */ import java.io.*; public ...

  6. 浅谈echo、print、var_dump()、print_r()的区别

    1.echo 和 print 的区别 共同点:首先echo 和 print 都不是严格意义上的函数,他们都是语言结构;他们都只能输出 字符串,整型跟int型浮点型数据.不能打印复合型和资源型数据: 而 ...

  7. Apache URL重写规则

    1.简介 Apached的重写功能,即是mod_rewrite模块功能,它是apache的一个模块.它的功能非常强大,可以操作URL中的所有部分. 因此我们就可以改写url,给用户提供一个简介大方的u ...

  8. IP设置

    由于家里的IP地址与公司的不一样,每次都要修改很麻烦,所以自己只做了一个IP修改bat. 打开记事本,把一下代码复制到记事本里,保存成bat就OK了.在23行设置自己的IP地址就可以了. @echo ...

  9. winfrom 实现条形码批量打印以及将条形码信息生成PDF文件

    最近,老大让给客户做个邮包管理程序.其中,包括一些基本信息的增.删.查和改,这些倒不是很难搞定它分分钟的事.其主要难点就在于如何生成条形码.如何批量打印条形码以及将界面条形码信息批量生成以其各自的 b ...

  10. HTTP上传 文件上传 图片上传 HTTP上传原理 文件上传原理 图片上传原理

    1.概述 在最初的http协议中,没有上传文件方面的功能.rfc1867(http://www.ietf.org/rfc/rfc1867.txt )为http协议添加了这个功能.浏览器按照此规范将用户 ...