关于javascript获取页面高度宽度
在市容市政项目中,计算jqgrid的自适应高度时,发现jQuery(window).height()和jQuery(document).height()的数值有差异。
最初使用的是jQuery(document).height()比jQuery(window).height()的值大。
$(window).height(); //为当前可见区域
$(document.body).height(); //body的高度
网页可见区域宽: document.body.clientWidth
网页可见区域高: document.body.clientHeight
网页可见区域宽: document.body.offsetWidth (包括边线的宽)
网页可见区域高: document.body.offsetHeight (包括边线的高)
网页正文全文宽: document.body.scrollWidth
网页正文全文高: document.body.scrollHeight
网页被卷去的高: document.body.scrollTop jquery中可用$(window).scrollTop()
网页被卷去的左: document.body.scrollLeft
网页正文部分上: window.screenTop 地址栏 工具栏部分
网页正文部分左: window.screenLeft
屏幕分辨率的高: window.screen.height
屏幕分辨率的宽: window.screen.width
屏幕可用工作区高度: window.screen.availHeight
屏幕可用工作区宽度: window.screen.availWidth
JQuery:
$(document).ready(function(){
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height()); //浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true)); //浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width()); //浏览器当前窗口文档对象宽度
alert($(document.body).width()); //浏览器当前窗口文档body的宽度
alert($(document.body).outerWidth(true)); //浏览器当前窗口文档body的总宽度 包括border padding margin
});
关于javascript获取页面高度宽度的更多相关文章
- jquery、js获取页面高度宽度等
jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...
- Javascript 获取页面高度(多种浏览器)
//2015年8月13日11:00:50 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: d ...
- Javascript获取图片原始宽度和高度的方法详解
前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多,本文将再次给大家谈谈这个问题,或许会对一些人能有所帮助. 方法详解 页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能 ...
- javascript 获取页面的高度及滚动条的位置的代码
http://www.jb51.net/article/23331.htm javascript 获取页面的高度及滚动条的位置的代码 作者: 字体:[增加 减小] 类型:转载 javascript ...
- JQuery或JavaScript获取网页的宽度、高等
最近多次使用JQery或JavaScript获取网页的宽度或者高度,在网上搜索N久之后发现很多都是粘贴上去并没有详细的介绍,这里我将会对经常使用的一些获取页面宽高的属性,方法做详细的介绍,以便能够更加 ...
- 用JavaScript获取页面上被选中的文字的技巧
这里介绍的一个小技巧是如何用JavaScript获取页面上被选中的文字的方法.最关键的JavaScript API是: event.selection = window.getSelection(); ...
- 用javaScript获取页面元素值
用JavaScript获取页面元素常见的三种方法: getElementById() ...
- js里获取页面高度和文档高度
$(window).height() 和 $(document).height()的区别 $(window).height()代表了当前可见区域的大小,$(document).height()则代表了 ...
- JavaScript获取页面元素的常用方法
1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 ...
随机推荐
- App创意项目助跑计划
APP创意项目助跑计划 该计划旨在帮助同学们将各种脑中稀奇古怪的想法借助互联网/移动互联网 相关的技术变成真实的项目. 谱写你的故事,从此刻开始! 我们帮助你提高编程(Java.C++.Objecti ...
- CDN技术原理
要了解CDN的实现原理,首先让我们来回顾一下网站传统的访问过程,以便理解其与CDN访问方式之间的差别: 由上图可见,传统的网站访问过程为: 1. 用户在浏览器中输入要访问的域名: 2. 浏览器向域名解 ...
- Golang与MySQL
1. 在golib下载go-sql-driver/mysql go get github.com/go-sql-driver/mysql 2. 代码引入 import ( "database ...
- ubuntu 安装cloudera hadoop
参考:http://www.aboutyun.com/thread-8921-1-1.html auto wlan0iface wlan0 inet staticaddress 10.32.37.12 ...
- mvvm 模式
MVC = Massive View Controller ? 有笑话称MVC为重量级的试图控制器.仔细一想,确实存在这个问题.以UITableViewController和UITableView举个 ...
- iOS之走进精益编程01
Model类 .h #import <Foundation/Foundation.h> @interface Product : NSObject @property (nonatomic ...
- Entity Framework 学习第二天
今天记录的内容不多,只是简单用一下Model first,新建项目,然后添加新建项,选择数据中的ado.net实体数据模型 这次我们选择空模型,然后右键,新增,实体 在这项demo中我打算建两个数据实 ...
- android实现左右滑动菜单
直接看效果图: 主要实现代码: package com.way.view; import android.content.Context; import android.media.Den ...
- 【Evaluate Reverse Polish Notation】cpp
题目: Evaluate the value of an arithmetic expression in Reverse Polish Notation. Valid operators are + ...
- 学习Linux第七天
1.shell echo $HOME 默认在shell中编写的变量全部是局部变量,如果重新打开console的话,那么这些变量将全部丢失,全局的变量可以写在文件~/.bashrc文件. 2.判断 !/ ...