js的各种获取大小
相信大家也经常会被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的各种获取大小的更多相关文章
- JS设置和获取盒模型的宽和高
JS设置和获取盒模型的宽和高 dom.style.width/height:只能取出内联样式的宽度和高度 dom.currentStyle.width/height:获取即时的计算的样式,但是只有IE ...
- js设置、获取单值cookie和多值cookie
js设置.获取单值cookie和多值cookie,代码如下: var CookieUtil = (function () { var Cookie = function () { // 获取单值coo ...
- js之如何获取css样式
js之如何获取css样式 一.获取内联样式 1 <div id ="myDiv" style="width:100px;height:100px; border ...
- offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
- js简单日期获取( 菜鸟入门基础)
关于js日期的获取要用到最基本的Date()方法获取当日的日期 var d =new Date(); //定义日期对象 var y=d.getFullYear(); //获取年 var m=d. ...
- js与jquery获取父元素,删除子元素的不同方法
var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...
- 小议 js 下字符串比较大小
原文:小议 js 下字符串比较大小 之前群里有人问如何比较两个时间大小,他的时间格式是 2014-08-08 而不是 2014-8-8.所以我给的方法是 直接比较,如: var a = "2 ...
- 2.Node.js access_token的获取、存储及更新
文章目录: 1.Node.js 接入微信公众平台开发 2.Node.js access_token的获取.存储及更新 一.写在前面的话 上一篇文章中,我们使用 No ...
随机推荐
- 让footer固定在页面底部(CSS-Sticky-Footer)
让footer固定在页面底部(CSS-Sticky-Footer) 这是一个让网站footer固定在浏览器(页面内容小于浏览器高度时)/页面底部的技巧.由HTML和CSS实现,没有令人讨厌的h ...
- RQNOJ--160 竞赛真理(01背包)
题目http://www.rqnoj.cn/problem/160 分析:这是一个01背包问题,对于每一道题目,都有两个选择"做"或者"不做". 但是唯一不同的 ...
- 工业派-配置Intel神经计算棒二代(NCS2)
最近两天在工业派ubuntu16.04上配置了Intel神经计算棒二代——Intel Neural Compute Stick,配置过程之艰辛我都不想说了,实在是太折磨人.不过历尽千辛万苦,总算让计算 ...
- 不同版本springboot上传文件大小设置
参考原文:https://blog.csdn.net/awmw74520/article/details/70230591 Spring Boot 1.3.x或者之前 multipart.maxFil ...
- /proc/cpuinfo和/proc/meminfo来查看cpu信息与内存信息
#一般情况下使用root或者oracle用户查都可以. # 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 --查 ...
- 快速傅里叶变换(FFT)学习
首先,在写这篇博客之前,我还没有完全学会FFT. 先把会的部分打好,加深一下记忆(也可以说是做笔记吧). 初三了,还不会FFT,要退役喽-- 多项式乘法 点开这篇博客之前,你就应该知道,FFT是用来求 ...
- github 访问加速
http://nullpointer.pw/github%E4%BB%A3%E7%A0%81clone%E5%8A%A0%E9%80%9F.html hosts:https://raw.githubu ...
- centos 安装系列
装coreseek https://www.jb51.net/os/RedHat/462185.html 卸载mysql https://www.cnblogs.com/cyl048/p/687908 ...
- 19-10-19-I
中午考试困够呛. T1 我想打矩阵快速幂,然后我咕了 T2 打T1了所以又咕了. T3 每一个黑点更新答案只有两种方式: 更新子树. 更新父链上的兄弟,叔伯,…… 于是: 把树拍在$DFS$序上. 更 ...
- 深入浅出 Java Concurrency (14): 锁机制 part 9 读写锁 (ReentrantReadWriteLock) (2)[转]
这一节主要是谈谈读写锁的实现. 上一节中提到,ReadWriteLock看起来有两个锁:readLock/writeLock.如果真的是两个锁的话,它们之间又是如何相互影响的呢? 事实上在Reentr ...