JS和jquery获取各种屏幕的宽度和高度

Javascript:

网站建设哪家好，找成都创新互联公司！专注于网页设计、网站建设、微信开发、成都微信小程序、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了温泉免费建站欢迎大家使用！

网页可见区域宽：

document.body.clientWidth

网页可见区域高：

document.body.clientHeight

网页可见区域宽：

document.body.offsetWidth

(包括边线的宽)

网页可见区域高：

document.body.offsetHeight

(包括边线的高)

网页正文全文宽：

document.body.scrollWidth

网页正文全文高：

document.body.scrollHeight

网页被卷去的高：

document.body.scrollTop

网页被卷去的左：

document.body.scrollLeft

网页正文部分上：

window.screenTop

网页正文部分左：

window.screenLeft

屏幕分辨率的高：

window.screen.height

屏幕分辨率的宽：

window.screen.width

屏幕可用工作区高度：

window.screen.availHeight

屏幕可用工作区宽度：

window.screen.availWidth

JQuery:

$(document).ready(function(){

alert($(window).height());

//浏览器当前窗口可视区域高度

alert($(document).height());

//浏览器当前窗口文档的高度

alert($(document.body).height());//浏览器当前窗口文档body的高度

alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度

包括border

padding

margin

alert($(window).width());

//浏览器当前窗口可视区域宽度

alert($(document).width());//浏览器当前窗口文档对象宽度

alert($(document.body).width());//浏览器当前窗口文档body的宽度

alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度

包括border

padding

margin

})

如何使用jQuery获取对象的尺寸

jqObj.width();//获取宽度，该宽度不包含border（左右）和padding（左右）所占大小

jqObj.outerWidth();//也是获取宽度，该宽度包含border（左右）和padding（左右）所占大小

//高度同理，jqObj.height() 和 jqObj.outerHeight();

//比如有下面这样一个div

div id="box" style="width:15px; height:15px; border:solid 5px #ccc; padding:3px; "

/div

var jqObj = $("#box");

jqObj.width(); //结果为 15;

jqObj.outerWidth(); //结果为  15 + 10 + 6; 

//15为width,10为border-width左右的尺寸,6为padding左右的尺寸

jquery获取浏览器的宽度和高度怎么做的？为啥$(window).width()不行呢

jq不会出现这样的问题的，检查下代码存放位置是否正确。另外您的jq是什么版本的？另外如果实在取不到那就用这个

网页可见区域宽： document.body.clientWidth

网页可见区域高： document.body.clientHeight

网页可见区域宽： document.body.offsetWidth (包括边线的宽)

网页可见区域高： document.body.offsetHeight (包括边线的高)

网页正文全文宽： document.body.scrollWidth

网页正文全文高： document.body.scrollHeight

网页被卷去的高： document.body.scrollTop

网页被卷去的左： document.body.scrollLeft

网页正文部分上： window.screenTop

网页正文部分左： window.screenLeft

屏幕分辨率的高： window.screen.height

屏幕分辨率的宽： window.screen.width

屏幕可用工作区高度： window.screen.availHeight

屏幕可用工作区宽度： window.screen.availWidth

。。。。

document.body.clientWidth 用这个原生的 比jq快得快

JavaScript或者jQuery怎样获取一个隐藏元素的宽高

jquery中获取div中图片的宽和高的方法：

$("#content").width();

$("#content").height();

$("#content").innerWidth();//元素内部区域高度，忽略padding、border

$("#content").outerHeight();//忽略边框

$("#content").outerHeight(true);//包含边框高度

JS 获取当前浏览器宽高

JQuery获取：

console.log($(window).width()); //浏览器当前窗口可视区域宽度

console.log($(window).height()); //浏览器当前窗口可视区域高度

console.log($(document).width());//浏览器当前窗口文档对象宽度

console.log($(document).height()); //浏览器当前窗口文档的高度

console.log($(document.body).width());//浏览器当前窗口文档body的宽度

console.log($(document.body).height());//浏览器当前窗口文档body的高度

console.log($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin

console.log($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin

JS获取：

窗口可视区域宽度 ： document.documentElement.clientWidth || document.body.clientWidth;

窗口可视区域高度 ： document.documentElement.clientHeight || document.body.clientHeight;

窗口可视区域宽度+边线和滚动条 ： document.body.offsetWidth ;

窗口可视区域高度+边线和滚动条 ： document.body.offsetHeight ;

实际内容的宽度 ： document.body.scrollWidth;

实际内容的高度 ： document.body.scrollHeight;

滚动条下拉被卷起来的距离 ：document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

滚动条侧拉被卷起来的距离 ：document.body.scrollLeft || document.documentElement.scrollLeft ;

网页正文部分上 ：window.screenTop;

网页正文部分左 ：window.screenLeft;

元素的宽度 ：obj.offsetWidth;

元素的高度 ：obj.offsetHeight;

相对于父元素的上位移 ：obj.offsetTop;（在元素的包含元素不含滚动条的情况下）

相对于父元素的左位移 ：obj.offsetLeft;（在元素的包含元素不含滚动条的情况下）

文章题目：jquery获取宽高,在jquery中获取当前窗口的宽度值
新闻来源：http://ybzwz.com/article/dsohgps.html