相信大家也经常会被js的获取大小搞得头昏脑胀,到底应该用哪种方式获取才是我要的那种大小呢

好啦,在此我帮大家整理好我知道的那些。

window.screen.availHeight

   获取的是当前电脑的屏幕大小

   注意:这个大小是屏幕大小,不是浏览器窗口的大小

window.innerHeight

  获取的是当前浏览器的可用视口的大小

  想要整张页面刚好和占满的话就用这个吧

  注意:当谷歌浏览器全屏会有1px的误差(比实际全屏略大);火狐不存在

document.body.clientHeight:

  获取的是当前body的高度

  感觉和body的offsetHeight一样大

document.body.offsetHeight :

   当前的网页所占的撑起的body的大小,如果设置浮动可能这个值为0哦。

document.getElementById("box").style.height

   css中的height,废话就不多说了

window.getComputedStyle(document.getElementById("box"))["height"]

   当前计算后实际的高度,这个用在万一css的height为百分比或者rem,em该怎么办呢

document.element.offsetTop 和 window.pageYOffset  

  获取元素的高度和窗口的当前位置这个是相对于整个浏览器的,一般可以用来做滚动效果

js的各种获取大小的更多相关文章

  1. JS设置和获取盒模型的宽和高

    JS设置和获取盒模型的宽和高 dom.style.width/height:只能取出内联样式的宽度和高度 dom.currentStyle.width/height:获取即时的计算的样式,但是只有IE ...

  2. js设置、获取单值cookie和多值cookie

    js设置.获取单值cookie和多值cookie,代码如下: var CookieUtil = (function () { var Cookie = function () { // 获取单值coo ...

  3. js之如何获取css样式

    js之如何获取css样式   一.获取内联样式 1 <div id ="myDiv" style="width:100px;height:100px; border ...

  4. offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. js 和 jquery 获取页面和滚动条的高度 视口高度文档高度

    js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...

  6. js简单日期获取( 菜鸟入门基础)

    关于js日期的获取要用到最基本的Date()方法获取当日的日期 var d =new Date();  //定义日期对象 var y=d.getFullYear();   //获取年 var m=d. ...

  7. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

  8. 小议 js 下字符串比较大小

    原文:小议 js 下字符串比较大小 之前群里有人问如何比较两个时间大小,他的时间格式是 2014-08-08 而不是 2014-8-8.所以我给的方法是 直接比较,如: var a = "2 ...

  9. 2.Node.js access_token的获取、存储及更新

    文章目录:         1.Node.js 接入微信公众平台开发         2.Node.js access_token的获取.存储及更新 一.写在前面的话   上一篇文章中,我们使用 No ...

随机推荐

  1. 如何提高Axure设计的效率 提高Axure设计效率的10条建议

    如何更有效率的使用axure,这是新手需要掌握的技能.本文作者从实际经验中归纳出来的十条建议十分值得学习,转载分享给大家: Axure 是创建软件原型的快速有力的工具.上手很容易,但是,其中存在一个危 ...

  2. 上传本地项目到码云(gitee)

    1.码云上创建一个项目比如zhirong 2.本地创建一个文件夹F:\workspace\zhirong-items,进入zhirong-items打开git bash 3.执行git init ,这 ...

  3. StringBuffer清空

    转载自:http://blog.sina.com.cn/s/blog_56fd58ab0100qfcz.html 在开发程序的时候,经常使用StringBuffer来进行字符串的拼接.如果在循环中来反 ...

  4. 跟我一起学习webpack使用配置文件(二)

    接着跟我一起学习webpack(一)中的项目来,我们接下来使用配置文件 使用npx webpack -h 我们可以查看webpack的配置参数 从我们在package.json中添加的命令来看,当项目 ...

  5. JS钩子的机制与实现

    [什么是钩子] 接触过WordPress的朋友都知道,WP的程序中可以执行类似钩子的函数,当然是这PHP实现的钩子.在JavaScript中一样可以实现类似的功能. 用一句话来形容一下:钩子是将需要执 ...

  6. light oj 1057 状压dp TSP

    #include <iostream> #include <cstdlib> #include <cstring> #include <queue> # ...

  7. httpclient遇到java.net.URISyntaxException: Illegal character in scheme name at index 0:

    正准备按照大佬的解决办法处理, 看会一条回复,说url有空格 检查了一下,还真是有空格 去除url中的空格,问题解除

  8. Python-新手爬取安居客新房房源

    新手,整个程序还有很多瑕疵. 1.房源访问的网址为城市的拼音+后面统一的地址.需要用到xpinyin库 2.用了2种解析网页数据的库bs4和xpath(先学习的bs4,学了xpath后部分代码改成xp ...

  9. mysql中not in子查询不能为空

    转载自:https://blog.csdn.net/headingalong/article/details/77744755 错误sql delete from company_info where ...

  10. css3之属性选择器

    总体来看一下都有哪些选择器 1.属性选择器  1)[att*=val] 2)[att^=val] 3)[att$=val] 2.结构伪类选择器 3.UI伪类选择器 其中E:read-only伪类选择器 ...