window.screen.height和window.screen.availHeight和document.body.clientHeight和document.documentElement.clientHeight
说这几个属性前 我说一下我的设备
我的设备有两个，一个高度为1080的显示器，一个高度为800的电脑
第一种：window.screen.height
这个方法是获取用户电脑屏幕的高度，是不关浏览器或者顶部工具栏跟底部工具栏的高度的
当我在高度为1080的我的显示屏屏幕上打印
window.screen.height
当我在我的电脑上打印
window.screen.height
是的 ，这个属性就是电脑的高度
第二个属性：window.screen.availHeight
这个属性，看字面意思，顾名思义，就是电脑屏幕的可用高度，
那当然就是电脑屏幕减掉顶部工具栏跟底部工具栏的高度
我在显示器上打印了这个属性，会得到以下
window.screen.availHeight
1057
1057是等于=1080(电脑屏幕)-23(顶部工具栏)
因为我的显示器上面没有底部工具栏
好，现在我在我的电脑上打印
window.screen.availHeight
是714=800-顶部工具栏(22)-底部工具栏(64)
第三个：document.body.clientHeight
这个属性只跟浏览器的高度有关
当时我在显示器上打印的时候，我打印来
document.body.clientHeight
我一脸懵逼，这怎么会有三千多高度呢
我屏幕一共才1080
后来我才想通，是浏览器里面的整个页面高度，因为我打开一个页面调试的时候是有滚动条的
第四个:document.documentElement.clientHeight
这个属性就是只跟浏览器有关，是浏览器里面的页面的可用可见高度
就还是我刚才那个显示器打印
document.documentElement.clientHeight
是的 我想说的就是这些了，反正我研究了一下这个之后，对这几个获得高度的属性差不多知道了
还有什么的话欢迎各位补充哦
第五个：window.innerHeight
window.screen.height和window.screen.availHeight和document.body.clientHeight和document.documentElement.clientHeight的更多相关文章
- JS对象 屏幕分辨率的高和宽 window.screen 对象包含有关用户屏幕的信息。 1. screen.height 返回屏幕分辨率的高 2. screen.width 返回屏幕分辨率的宽
屏幕分辨率的高和宽 window.screen 对象包含有关用户屏幕的信息. 1. screen.height 返回屏幕分辨率的高 2. screen.width 返回屏幕分辨率的宽 注意: 1.单位 ...
- 网页Screen width、height、availWidth、availHeight属性
*screen.width 功能:声明了显示浏览器的屏幕的宽度,以像素计. 语法:screen.width *screen.height 功能:声明了显示浏览器的屏幕的可用宽度,以像素计. 语法:sc ...
- javascript宿主对象之window.screen、window.close()/open()、window.moveTo、window.resizeTo
window.screen属性所提供的是浏览器以外的信息.这里只简单的概述一下: screen.availWidth - 可用的屏幕宽度 (除去操作系统菜单) screen.availHeight - ...
- screen.height && screen.width
screen.height && screen.width how to get window max width in js screen.height; screen.width; ...
- document.documentElement.clientHeight 和 $(window).height() 无法正确获取页面可视区高度
背景: 弹出层插件(自适应) 实现过程中突然发现在获取可视区高度时,无论document.documentElement.clientHeight 还是 $(window).height()都无法正确 ...
- 拉动滚动条追加内容,无限延伸document高度 $(window).scroll(function(){if($(window).scrollTop() + $(window).height() == $(document).height()) { $("body").append(html) } })
$(document).ready(function() { // endless scrolling $(window).scroll(function() { if($(window).scrol ...
- $(document).height()、$("body").height()、$(window).height()区别和联系
前言:在此以高度为示例,宽度问题可类推.在移动端开发中,经常遇到需要把一块内容定位于底部的情况,当页面内容不满一屏时,需要设为fixed,而超过 一屏时,需要设为static随页面顶到底部,此时就需要 ...
- 网页上弹出pop窗口实例，(document).height()与$(window).height()的区别
#dvbg{background-color:#666666; position:absolute; z-index:99; left:0; top:0; display:none; width:10 ...
- $(document).height 与$(window).height的区别
$(document).scrollTop() 获取垂直滚动的距离 (即当前滚动的地方的窗口顶端到整个页面顶端的距离)$(document).scrollLeft() 这是获取水平滚动条的距离 要获取 ...
随机推荐
- CodeForces 185A. Plant (矩阵快速幂)
CodeForces 185A. Plant (矩阵快速幂) 题意分析 求解N年后,向上的三角形和向下的三角形的个数分别是多少.如图所示: N=0时只有一个向上的三角形,N=1时有3个向上的三角形,1 ...
- 【线段树】【P3372】模板-线段树
百度百科 Definition&Solution 线段树是一种log级别的树形结构,可以处理区间修改以及区间查询问题.期望情况下,复杂度为O(nlogn). 核心思想见百度百科,线段树即将每个 ...
- cuda环境下安装opencv出现nvcc warning : The 'compute_11'
警告打印: nvcc warning : The 'compute_11', 'compute_12', 'compute_13', 'sm_11', 'sm_12', and 'sm_13' arc ...
- 在某OC字符串中，搜索指定的某字符串：-rangeOfString:
NSString *originalStr = @"搜索:王者拜仁!"; NSString *subStr = @"搜索:"; // 在originalStr这 ...
- OpenCV学习笔记（01）我的第一个OpenCV程序（环境配置）
昨天刚刚考完编译原理,私心想着可以做一些与考试无关的东西了.一直想做和图像处理相关的东西,趁这段时间有空学习一下OpenCV,搭建环境真是一件麻烦的事情,搞了近三个小时终于OK了.先来张图: 大致描述 ...
- HDU1832 二维线段树求最值（模板）
Luck and Love Time Limit: 10000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Tota ...
- javascript常用实例的实现与封装
地址:https://github.com/chenhuiYj/ec-do 2.字符串操作 2-1去除字符串空格 //去除空格 type 1-所有空格 2-前后空格 3-前空格 4-后空格 fu ...
- Java设计模式の单例模式
-------------------------------------------------- 目录 1.定义 2.常见的集中单例实现 a.饿汉式,线程安全 但效率比较低 b.单例模式的实现:饱 ...
- 【C++ STL】Stack
1.定义 class stack<> 实作出一个stack(也成为LIFO,后进先出),你可以使用push()将任意数量的元素置入stack中,也可以使用pop()将元素依次插入次序反序从 ...
- Linux和windows下检查jsp后门文件的方法
Linux下: find . -name "*.jsp" | xargs egrep -liw "createNewFile| File\(| File |applica ...