之前写了一个关于滚动条的东西,可是在写的时候发现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. HYML / CSS部分

    1.什么是盒子模型? 在网页中,一个元素占有空间的大小由几个部分构成,其中包括元素的内容(content),元素的内边距(padding),元素的边框(border),元素的外边距(margin)四个 ...

  2. 某公司HP-EVA4400数据丢失的恢复方法和恢复全过程

    一.故障描述1.设备清单一台HP-EVA4400控制器(型号:AG638-53011)三台HP-EVA4400扩展柜(型号为AG638-63001),和28块HP-FC磁盘(型号为300G FC硬盘) ...

  3. IDEA第二章----配置git、tomcat(热部署)、database,让你的项目跑起来

    第一节:下载git客户端,整合idea 由于博主公司用的git版本管理,所以本系列都是基于git版本工具的,当然SVN与git配置类似.git同样支持安装版和解压版,支持各种操作系统,我这里下载的是W ...

  4. ELK logstash 处理MySQL慢查询日志(初步)

    写在前面:在做ELK logstash 处理MySQL慢查询日志的时候出现的问题: 1.测试数据库没有慢日志,所以没有日志信息,导致 IP:9200/_plugin/head/界面异常(忽然出现日志数 ...

  5. css中最基本几个选择器

    css中有四种不同的选择器 ①类选择器,又叫class选择器.类选择器{属性名:属性值:...}/*类选择器*/.s1{ font-weight:bold;font-size:16px;}②id选择器 ...

  6. poj1125 Stockbroker Grapevine Floyd

    题目链接:http://poj.org/problem?id=1125 主要是读懂题意 然后就很简单了 floyd算法的应用 代码: #include<iostream> #include ...

  7. 如何优雅地运用 Chrome (Google)

    已经在很多工具类文章前言中,提及使用工具的重要性:以至于在写这篇时候,大为窘迫:穷尽了脑海中那些名句箴言,目测都已然在先前文章中被引用.鉴于杳让人心底意识到工具的重要性,并且能践行之,远比介绍如何使用 ...

  8. angular.js封装的文件上传指令

    今天把最近用到的东西整理一下,直接上代码,需要申请犀牛存储图片,文件 1.html div div img.img-thumbnail.center-block(ng-src="{{ltUp ...

  9. Jenkins 远程构建任务

    开发过程中提交代码以后,如何不登录Jenkins就自动触发jenkins 任务来发布软件版本. 1.首先我们创建一个Jenkins任务. 2.选择"构建触发器"->勾选&qu ...

  10. VR全景智慧城市-VR大时代

    这是一个创业的时代,这是一个创新的社会,我们的国家从没有像今天这样高度重视创业创新,我们的社会从没有像今天这样对创业创新寄予如此厚望.李克强总理在2015年政府工作报告中指出:要把"大众创业 ...