之前写了一个关于滚动条的东西,可是在写的时候发现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. Hibernate考试试题(部分题库)含答案

    Hibernate考试试题 (题库) 1.  在Hibernate中,下列说法正确的有( ABC ).[选三项] A.Hibernate是一个开放源代码的对象关系映射框架 B.Hibernate对JD ...

  2. python基本数据类型——set

    一.集合的定义 set集合,是一个无序且不重复的元素集合. 集合对象是一组无序排列的可哈希的值,集合成员可以做字典中的键.集合支持用in和not in操作符检查成员,由len()内建函数得到集合的基数 ...

  3. 第二章、元组和列表(python基础教程第二版 )

    最基本的数据结构是序列,序列中每个元素被分配一个序号-元素的位置,也称索引.第一个索引为0,最后一个元素索引为-1. python中包含6种内建的序列:元组.列表.字符串.unicode字符串.buf ...

  4. 使用 PHPStorm + Xdebug 实现断点调试(二)

    一.配置 Xdebug 配置 Xdebug 相关参数,在 php.ini 文件中新增如下配置,如果没安装的,请参考<PHP 安装 Xdebug扩展>: [xdebug] xdebug.re ...

  5. JavaScriptCore全面解析 (下篇)

    欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 殷源,专注移动客户端开发,微软Imagine Cup中国区特等奖获得者,现就职于腾讯. 接JavaScript ...

  6. Hibernate配置文件中配置各种数据库链接

    hibernate.properties ###################### ### Query Language ### ###################### ## define ...

  7. 【Java SE】如何用Java实现直接选择排序

    摘要:直接选择排序属于选择排序的一种,但是它的排序算法比冒泡排序的速度要快一些,由于它的算法比较简单,所以也比较适合初学者学习掌握. 适宜人群:有一定Java SE基础,明白Java的数据类型,数组的 ...

  8. TPshop中B2C与B2B2C的一点理解

    首先来一段百度百科记录一下: B2C 是Business-to-Customer的缩写,而其中文简称为"商对客"."商对客"是电子商务的一种模式,也就是通常说的 ...

  9. JS中作用域

    var scope = 'global'; var f = function() { console.log(scope); // 输出 undefined var scope = 'f'; } f( ...

  10. 解析HTML

                                                    解析HTML 一.什么是HTML HTML是超文本标签语言,即网页的源码.而浏览器就是翻译解释HTML源 ...