jquery获取关于宽度和高度的尺寸问题
作者原创,转载请出名出处!
console.log("可视区高度:"+$(window).height());
console.log("可视区宽度:"+$(window).width());
console.log("页面文档的高度:"+$(document).height());
console.log("页面文档的宽度:"+$(document).width());
console.log("浏览器当前窗口文档body的高度:"+$(document.body).height());
console.log("浏览器当前窗口文档body的宽度:"+$(document.body).width());
console.log("获取滚动条到顶部的垂直高度 (即网页被卷上去的高度):"+$(document).scrollTop());
console.log("获取滚动条到左边的垂直宽度 :"+$(document).scrollLeft());
console.log("获取或设置元素的宽度:"+$('#wrap').width());
console.log("获取或设置元素的高度:"+$('#wrap').height());
console.log("某个元素的上边界到body最顶部的距离:obj.offset().top;(在元素的包含元素不含滚动条的情况下):"+$("#wrap").offset().top);
console.log("某个元素的左边界到body最左边的距离:obj.offset().left;(在元素的包含元素不含滚动条的情况下):"+$("#wrap").offset().left);
测试效果如下:

注:我的浏览器大小可能和你的不一样哦。所以,每个人的值都不一定是一样的。
jquery获取关于宽度和高度的尺寸问题的更多相关文章
- JQUERY 获取 DIV 宽度与高度(width,padding,margin,border)
一般讲的宽度指的是内容宽度,但一个 div 的实际宽度不仅只于内容宽度,尤其在做 CSS 排版时更不能搞错,必须同时考虑 Padding.Border 与 Margin 的宽度,四个加起来才是 di ...
- jquery获取和设置元素高度宽度
jquery获取和设置元素高度宽度 1.height()/ width() 取得第一个匹配元素当前计算的高度/宽度值(px) height(val)/ width(val) 为每个匹配的元素设置CSS ...
- JS获取各种宽度、高度的简单介绍:
JS获取各种宽度.高度的简单介绍: scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获 ...
- JQuery获取当前屏幕的高度宽度
JQuery获取浏览器窗口宽高,文档宽高的代码,使用jquery的朋友可以参考下. <script type="text/javascript"> $(document ...
- JS 获取各个宽度和高度
IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...
- JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别
整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...
- javascript获取对象宽度和高度
标签元素的宽高值获取//绝对宽度Obj.offsetWidth//绝对高度Obj.offsetHeight 以下是获取窗口对象的宽高值.clientHeight 获取对象的高度,不计算任何边距.边 ...
- [Flex] 动态获取组件宽度和高度
flex中我们有时并不想一开始就设置某个组件的宽度和高度,而想动态获取某个组件经填充后的width和height,但是会发现width和height均为0,这时我们可以注册一下两个事件之一来解决. i ...
- JQuery获取浏览器窗口的高度和宽度
<script type="text/javascript"> $(document).ready(function() { alert($(window).heigh ...
随机推荐
- javascript的canvas绘图的基本用法
<canvas>是HTML里面非常强大的元素,利用它结合js可以实现很多动画效果,大大增强交互性.下面,我想用图文并茂的方式阐述一下canvas的绘图机制的基础内容,话不多说,先上代码: ...
- SQL Server 内存和Paging
一,内存term VAS:Virtual Address Space,是App能够申请访问的最大地址空间. Physical Memory:对SQL Server 来说,频繁访问的数据对象长时间驻留在 ...
- 【开源】OSharp框架解说系列(3):扩展方法
OSharp是什么? OSharp是个快速开发框架,但不是一个大而全的包罗万象的框架,严格的说,OSharp中什么都没有实现.与其他大而全的框架最大的不同点,就是OSharp只做抽象封装,不做实现.依 ...
- 修复bootstrap daterangepicker中的3个问题
最近项目中使用了一个基于Bootstrap的daterangepicker控件. 1.点击页面其他空白的地方,会把之前在日历上选中的日期选择上. 具体描述: 1.点击打开日期选择框 2.选择一个日期范 ...
- CSS之水平垂直居中
在css的世界里,如果我们想让一个块级元素水平居中,想必大家都知道利用margin:0 auto;嘛,这样就可以让块级元素在它的父元素中水平居中了. 列如这样: <!DOCTYPE html&g ...
- 使用karma测试平时写的小demo(arguments为例)
有人说前端自动化测试非常困难,我觉得确实如此.在项目中,我个人也不放心写的测试,还是要手动测试.但是我们平时写demo学习时,完全可以使用自动化测试. 传统demo 1,新建一个html 2,写入js ...
- 前端编码风格规范之 JavaScript 规范
JavaScript 规范 全局命名空间污染与 IIFE 总是将代码包裹成一个 IIFE(Immediately-Invoked Function Expression),用以创建独立隔绝的定义域.这 ...
- 用backbone实现的一个MVC的小demo
一.Apache配置 本实例需要使用php支持.要现在Apache中配置虚拟目录,在Apache下的httpd-vhosts.conf文件中添加如下代码 <VirtualHost *:80> ...
- Jackson的简单用法
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1简介 Jackson具有比较高的序列化和反序列化效率,据测试,无论是 ...
- C#运用GmaQrCode生成二维码
项目中需要生成二维码,方法比较多,可以采用JS插件,也可以采用第三方插件后台生成二维码,在后台方法中可以采用QRCode或者GmaQrCode,现在介绍一种C#在后台生成二维码的方法: /// < ...