jQuery下 $(window)和$(document)的width、height方法值得区别

在没有垂直滚动条的时候 $(window)和$(document) 的宽高一致
在有垂直滚动条的时候 $(window)和$(document) 的宽度一致 window的高度为可视区域的高度，document为整个html文档的高度（包含margin padding border就是总的）

在没有水平滚动条的时候 $(window)和$(document) 的宽高一致
在有水平滚动条的时候 $(window)和$(document) 的高度一致
window的宽度为可视区域的宽度，document 为整个html文档的宽度（包含margin padding border就是总的）

总结：
1. 在垂直和水平滚动条都没有的情况下 $(window).width()与$(document).width()一致，$(window).height()与$(document).height()一致
2. 在垂直和水平滚动条同时存在或者存在一个的时候，window的宽或高总为可视区域的宽或高（不包括滚动条的宽高），而document文档的总为页面文档实际的宽或高（包含超出可视区域）

时间： 2024-07-29 15:22:30

jQuery下 $(window)和$(document)的width、height方法值得区别的相关文章

jQuery中几个关于元素宽高方法的区别

几个关于元素宽高的方法 height():带参数设置,不带参数获取,参数是number类型 width():带参数设置,不带参数获取,参数是number类型 innerHeight() :内边距+内容的高度 innerWidth() :内边距+内容的宽度 outerHeight:上下内边距+内容+上下边框 outerWidth :左右内边距+内容+左右边框 案例测试: <!DOCTYPE html> <html lang="en"> <head> &

jquery中append、prepend, before和after方法的区别（一）

原文:http://blog.csdn.net/woosido123/article/details/64439490 在 jquery中append() 与 prepend()是在元素内插入内容(该内容变成该元素的子元素或节点),after() 与before()是在元素的外面插入内容(其内容变成元素的兄弟节点). 1. append()和prepend() <div class='a'> <div class='b'>b</div> </div> 1 2

jquery中选择器的 html() text() val() attr() 方法的区别与使用方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>html() text() val() attr()</title> <script src="./js/jquery-1.12.4.min.js"></script> <script> $(funct

jQuery中attr和prop方法的区别

相比attr,prop是1.6.1才新出来的,两者从中文意思理解,都是获取/设置属性的方法(attributes和properties).只是,window或document中使用.attr()方法在jQuery1.6之前不能正常运行,因为window和document中不能有attributes.prop应运而生了. 之前看网上对比两者的文章,更是列出一个表来区分什么标签下使用prop,什么标签下使用attr,原谅我是懒惰的人,最害怕要背的东西,所以只有自己想想办法了. 既然我们想知道他们两的

JQuery调用iframe子页面函数/对象的方法例子

父页面有个ID为mainfrm.name为Iframe1的iframe,iframe连接b.html,该页面有个函数test 在父页面调用b.html的test方法为: $("#mainfrm")[0].contentWindow.test(); 或者 this.frames["Iframe1"].doQuery(); 在当前弹出的子页面中打开另一个打开页面中的函数,例如在弹出的edit.html页面中调用dataList.html页面中的函数test parent

[JS]jQuery中attr和prop方法的区别

相比attr,prop是1.6.1才新出来的,两者从中文意思理解,都是获取/设置属性的方法(attributes和properties).只是,window或document中使用.attr()方法在jQuery1.6之前不能正常运行,因为window和document中不能有attributes.prop应运而生了. 之前看网上对比两者的文章,更是列出一个表来区分什么标签下使用prop,什么标签下使用attr,原谅我是懒惰的人,最害怕要背的东西,所以只有自己想想办法了. 既然我们想知道他们两的

jquery $(window) 和$(document)的实践

$(window).scrollTop() 和$(document).scrollTop()得出的结果是一样的 $(window).height()得到的浏览器的窗口的高度,随着窗口大小改变而改变.(在文档加载完成之后使用) $(document).height()得出的是文档的高度,这个高度 变 $(window).width()得到的浏览器的窗口的宽度, ;gutter:true;"><li>$(document).width()得出的是文档的宽度,当窗口 大于 度 . j

jQuery 提供多个处理尺寸的重要方法：width() height() innerWidth() innerHeight() outerWidth() outerHeight()

一. width() 方法设置或返回元素的宽度(不包括内边距.边框或外边距). height() 方法设置或返回元素的高度(不包括内边距.边框或外边距). 二. innerWidth() 方法返回元素的宽度(包括内边距). innerHeight() 方法返回元素的高度(包括内边距). 三. outerWidth() 方法返回元素的宽度(包括内边距和边框). outerHeight() 方法返回元素的高度(包括内边距和边框). 四. outerWidth(true) 方法返回元素的宽度(包括内边

JavaScript大杂烩15 - 使用JQuery(下)

前面我们总结了使用各种selector拿到了jQuery对象了,下面就是对这个对象执行指定的行为了. 2. 操作对象 - 行为函数action 执行jQuery内置的行为函数的时候,JQuery自动遍历jQuery对象中包装的所有对象,依次在这些对象上执行指定的行为,直白的说,就是JQuery执行的是批量的操作,所以在JQuery中,默认情况下,是不需要强行的遍历包装对象,然后独自的执行指定的行为的.下面是常用的行为函数介绍. 1). 遍历jQuery对象 虽然执行jQuery内置的方法的时候不