之前写了一个关于滚动条的东西,可是在写的时候发现JQuery在获取宽度和高度时在不同浏览器中是不一样的,下面发一下代码给给位看官先展示一下:

 $(function(){
$("#main").html(
"$(document).width():"+$(document).width()+
"<br />$(document).height():"+$(document).height()+
"<br />$(window).width():"+$(window).width()+
"<br />$(window).height():"+$(window).height()+
"<br />$(document.body).width():"+$(document.body).width()+
"<br />$(document.body).height():"+$(document.body).height()
);
});

打印出来的截屏如下:

这个是在Chrome中的效果,下面来看一下IE中的:

比较一下吧~我们可以看到,当选择document的时候两个浏览器出现了不同的值,IE中对于document的宽和高都增加了4像素,而对于window和document.body的却很正常,所以打算通过屏幕的大小来设定网站轮廓大小的童鞋还是多用用window的宽和高吧!

ps:document.body在没有内容的时候高度是零,为什么呢?你说为什么呢?哈哈……这么简单的问题就不用我回答了吧~要是还不明白就去看看html的DOM吧~要是还不懂可以给我留言~

关于JQuery获取宽度和高度在chrome和IE下的不同的更多相关文章

  1. jquery获取文档高度和窗口高度的例子

    jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...

  2. 基于jQuery自适应宽度跟高度可自定义焦点图

    基于jQuery自适应宽度跟高度可自定义焦点图.这是一款带左右箭头,缩略小图切换的jQuery相册代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <section cl ...

  3. jquery获取文档高度和窗口高度汇总

    jquery获取窗口高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...

  4. javascript、jquery获取网页的高度和宽度

    javascript: 可视区域宽 :document.documentElement.clientWidth  (width + padding) 可视区域高 :document.documentE ...

  5. jquery获取浏览器的高度和宽度

    <script type="text/javascript"> $(document).ready(function() { alert($(window).heigh ...

  6. js和jquery获取屏幕的高度

    Javascript: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: document.b ...

  7. js和jq获取宽度和高度

    Javascript: console.log(document.body.clientWidth); //网页可见区域宽(body) console.log(document.body.client ...

  8. jquery获取元素对应高度

    https://www.cnblogs.com/sntetwt/p/3823592.html 获取点击元素距离页面的高度 $(select).offset().top - $(document).sc ...

  9. jquery获取三种高度

    反复用到却一直记不住... var a = $(window).height() //设备的高度 var b = $(window).scrollTop() //滚动的高度 var c = $(doc ...

随机推荐

  1. linux下删除乱码文件、目录

    由于编码原因,在linux服务器上上传.创建中文文件或目录时,会产生乱码,如果想删除它,发现用rm命令是删除不了的 这种情况下,用find命令可以删除乱码的文件或目录. 首先进入乱码文件或目录所在的目 ...

  2. html基础认识,高手别看

    HTML5是一种用于在万维网上构建和呈现内容的符号言语.它是HTML规范的第五和当时版别.它是由万维网联盟(W3C)在十月发布的2014 [ 2 ] [ 4 ]和最新的多媒体支持进步言语,一起坚持它简 ...

  3. 规范模式-------From ABP Document

    介绍 规范模式是一种特定的软件设计模式,通过使用布尔逻辑 (维基百科)将业务规则链接在一起,可以重新组合业务规则. 在实际中,它主要用于 为实体或其他业务对象定义可重用的过滤器. 例 在本节中,我们将 ...

  4. css3实现checkbox变按钮

    css3实现checkbox变按钮 .search_checkbox { margin: 0; padding: 0; margin-left: 15px; display: inline-block ...

  5. Linux字符设备与块设备的区别与比较

    Linux中I/O设备分为两类:块设备和字符设备.两种设备本身没有严格限制,但是,基于不同的功能进行了分类. (1) 字符设备:提供连续的数据流,应用程序可以顺序读取,通常不支持随机存取.相反,此类设 ...

  6. HTML+CSS--position大法好

    其实在HTML和CSS的学习中,css的position属性应该是难点之一,难在你需要静下心来仔细搞清楚它的每一个值的意义.效果和用法.但是它的功能很强大,效果也是很令人惊艳的,因为你可以用它去实现一 ...

  7. poj3067树状数组求逆序数

    Japan plans to welcome the ACM ICPC World Finals and a lot of roads must be built for the venue. Jap ...

  8. php web开发安全之csrf攻击的简单演示和防范(一)

    csrf攻击,即cross site request forgery跨站(域名)请求伪造,这里的forgery就是伪造的意思.网上有很多关于csrf的介绍,比如一位前辈的文章浅谈CSRF攻击方式,参考 ...

  9. 573. Squirrel Simulation

    Problem statement: There's a tree, a squirrel, and several nuts. Positions are represented by the ce ...

  10. LINQ基础(二)

    本文主要介绍LINQ查询操作符 LINQ查询为最常用的操作符定义了一个声明语法.还有许多查询操作符可用于Enumerable类. 下面的例子需要用到LINQ基础(一)(http://www.cnblo ...