(知识点)JS获取网页高度
网页可见区域的宽:document.body.clientWidth
网页可见区域的高:document.body.clientHeight
网页可见区域的宽:document.body.offsetWidth(包括边线的宽)
网页可见区域的高:document.body.offsetHeight(包括边线的高)
网页正文全文的宽:document.body.scrollHeight
网页正文全文的高:document.body.scrollWidth
网页被卷去的高:document.body.scrollTop(IE8以下无效)
网页被卷去的左:document.body.scrollLeft(IE8以下无效)
网页被卷去的高:document.documentElement.scrollTop(IE8以下有效)
网页被卷去的左:document.documentElement.scrollLeft(IE8以下有效)
网页正文部分上:window.screenTop
网页正文部分做:window.scrollLeft
屏幕分辨率的高:window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区的高度:window.screen.availHeight
屏幕可用工作区的宽度:window.screen.availWidth
相对于窗口左上角的X:window.event.clientX
相对于窗口左上角的Y:window.event.clientY
相对于整个页面的X:window.event.X
相对于整个页面的Y:window.event.Y
这里注意:
2级Dom没有提供把窗口坐标转化为文档坐标的标准方法。在IE浏览器以外,使用window.pageXOffset和window.pageYoffset即可
function getInfo() {
            var s = "";
            s += " 网页可见区域宽:" + document.body.clientWidth;
            s += " 网页可见区域高:" + document.body.clientHeight;
            s += " 网页可见区域宽:" + document.body.offsetWidth + " (包括边线和滚动条的宽)";
            s += " 网页可见区域高:" + document.body.offsetHeight + " (包括边线的宽)";
            s += " 网页正文全文宽:" + document.body.scrollWidth;
            s += " 网页正文全文高:" + document.body.scrollHeight;
            s += " 网页被卷去的高(ff):" + document.body.scrollTop;
            s += " 网页被卷去的高(ie):" + document.documentElement.scrollTop;
            s += " 网页被卷去的左:" + document.body.scrollLeft;
            s += " 网页正文部分上:" + window.screenTop;
            s += " 网页正文部分左:" + window.screenLeft;
            s += " 屏幕分辨率的高:" + window.screen.height;
            s += " 屏幕分辨率的宽:" + window.screen.width;
            s += " 屏幕可用工作区高度:" + window.screen.availHeight;
            s += " 屏幕可用工作区宽度:" + window.screen.availWidth;
            s += " 你的屏幕设置是 " + window.screen.colorDepth + " 位彩色";
            s += " 你的屏幕设置 " + window.screen.deviceXDPI + " 像素/英寸";
            console.log(s);
        }
        getInfo();
(知识点)JS获取网页高度的更多相关文章
- js获取网页高度(详细整理)
		
网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: document.body.offset ...
 - JS获取网页高度和宽度
		
注:此文属于转载自他人博客 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeight 网页可见区域宽: docume ...
 - js获取网页高度
		
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWi ...
 - js获取网页高度和宽度(备份)
		
网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.body.offsetWi ...
 - js获取网页的各种高度
		
原文:js获取网页的各种高度 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: documen ...
 - JS获取网页属性包括宽、高等
		
JS获取网页属性包括宽.高等. function getInfo() { // www.jbxue.com var s = ""; s += " 网页可见区域宽:&q ...
 - js获取浏览器高度和宽度值,尽量的考虑了多浏览器。
		
js获取浏览器高度和宽度值,尽量的考虑了多浏览器. IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ...
 - JS获取网页宽高方法集合
		
JS获取网页宽高等方法的集合:document.body.clientWidth - 网页可见区域宽document.body.clientHeight - 网页可见区域高 document.body ...
 - jquery、js获取页面高度宽度等
		
jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...
 
随机推荐
- 实现类似MVC ViewBag类型的对象
			
public class ViewBag : DynamicObject { private readonly Dictionary<string,dynamic> dic=new Dic ...
 - HTML学习笔记汇总
			
笔记几乎涵盖了日常开发中全部的知识点以及相关注意事项 想要学习网页制作的初学者可以通过本篇笔记初步掌握HTML的使用,也可以将该笔记作为查阅资料查看 HTML简单结构 <html> < ...
 - 安装psacct或acct程序包
			
监视Linux用户活动 我认为,对每个想密切监视其服务器/系统上用户活动的Linux/Unix系统管理员来说,psacct或acct是优秀的.必需的应用程序之一. psacct或acct程序包提供了用 ...
 - C#_扩展方法
			
这里我先引用一个实例,需求是这样:我们要将一个字符串中的字幕大小写变换,即大写变小写,小写变大写. 通常,我们首先会考虑在当前类中写一个方法,将字符串传进去,然后返回变换后的字符串.这样写当然不会错, ...
 - Pad控件 UIPopoverController的介绍与使用(Pad的专属菜单控件、Swift版本)
			
UIPopoverController 是iPad特有控件,iOS9之前,在iOS上也可以使用,在iOS9之后,只能用于Pad上. 如果非要在iOS上使用,编译不会有问题,运行后会崩溃,报错如下: T ...
 - JDBC与ArrayList和hashmao
			
JDBC帮助类 package work; import java.beans.Statement;import java.sql.Connection;import java.sql.DriverM ...
 - css2.1实现图片添加阴影效果
			
盒子里面放了img标签,盒子浮动后,盒子的背景图片(就是阴影图片)会应用图片的宽高. <!DOCTYPE html> <html lang="en"> &l ...
 - 第2章Zabbix基础进阶
			
p.MsoNormal,li.MsoNormal,div.MsoNormal { margin: 0cm; margin-bottom: .0001pt; text-align: justify; t ...
 - 使用EPPlus读写xlsx文件
			
朋友有个需求,想对N张excel表做过滤和合并的处理,拜托我写个小程序.因为用户的背景是非专业用户,因此最好的选择是写个GUI程序,再加上读写excel的需求,所以我的首选就是C#的WinForm了. ...
 - 性能测试分享:Jmeter多机协作原理
			
性能测试分享:Jmeter多机协作原理 poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家咨询qq:90 ...