JS 获取当前浏览器宽高

JQuery获取：

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

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

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

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

consolelog($(documentbody)width());//浏览器当前窗口文档body的宽度

consolelog($(documentbody)height());//浏览器当前窗口文档body的高度

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

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

JS获取：

窗口可视区域宽度 ： documentdocumentElementclientWidth || documentbodyclientWidth;

窗口可视区域高度 ： documentdocumentElementclientHeight || documentbodyclientHeight;

窗口可视区域宽度+边线和滚动条 ： documentbodyoffsetWidth ;

窗口可视区域高度+边线和滚动条 ： documentbodyoffsetHeight ;

实际内容的宽度 ： documentbodyscrollWidth;

实际内容的高度 ： documentbodyscrollHeight;

滚动条下拉被卷起来的距离 ：documentdocumentElementscrollTop || windowpageYOffset || documentbodyscrollTop;

滚动条侧拉被卷起来的距离 ：documentbodyscrollLeft || documentdocumentElementscrollLeft ;

网页正文部分上 ：windowscreenTop;

网页正文部分左 ：windowscreenLeft;

元素的宽度 ：objoffsetWidth;

元素的高度 ：objoffsetHeight;

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

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

方法一：

alert('a'replace(/[^\u0000-\u00ff]/g,"aaa")length);

//原理：把中文字符替换成2个英文字母，那么字节数就是2，

//示例中改成替换成3个英文字母了。

//因此d出的字节数是3，如果要正确的，当然是替换成2个字母了

//\u0000这个表示的是unicode编码

第一种情况就是宽高都写在样式表里，就比如#div1{width:120px;}。这中情况通过#div1stylewidth拿不到宽度，而通过#div1offsetWidth才可以获取到宽度。

第二种情况就是宽和高是写在行内中，比如style="width:120px;"，这中情况通过上述2个方法都能拿到宽度。（什么是行内，就是直接在html标签上写样式）

小结，因为idoffsetWidth和idoffsetHeight无视样式写在样式表还是行内，所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过idstyleatrr来获取。

现在的前端制作很少直接把样式写style里了，都是写在样式表里。如果你要获取的样式没有相对应的（就像#div1stylewidth对 应#div1offsetWidth），就只能分别针对不用浏览器来获取样式表的属性了，可以试着搜索“JS 获取样式属性”之类的。

代码：

var o = documentgetElementById("view");var h = ooffsetHeight; //高度var w = ooffsetWidth; //宽度

扩展资料：

js编程:

JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。直译语言的弱点是安全性较差，而且在JavaScript中，如果一条运行不了，那么下面的语言也无法运行。而其解决办法就是于使用try{}catch(){}。

Javascript被归类为直译语言，因为主流的引擎都是每次运行时加载代码并解译。V8是将所有代码解译后再开始运行，其他引擎则是逐行解译（SpiderMonkey会将解译过的指令暂存，以提高性能，称为实时编译），但由于V8的核心部份多数用Javascript撰写（而SpiderMonkey是用C++）。

因此，在不同的测试上，两者性能互有优劣。与其相对应的是编译语言，例如C语言，以编译语言编写的程序在运行之前，必须经过编译，将代码编译为机器码，再加以运行。

参考资料：

javascript_百度百科

运用js获取div宽度，原生JS获取DIV的属性有两种方法，js 获取方法命令如下：

currentStyle和getComputedStyle，前者是兼容IE端的，后者也兼容W3C，两者内核不同，所以就有两种兼容的写法。

如果只是单独的获取某个属性值可以这样写：

objcurrentStyle[属性名];这种不兼容-webkit-内核的，

所以一般是封装成一个函数可以到处调用，而且不止针对某个属性值。

function getStyle(obj,styleName){if(objcurrentStyle){return objcurrentStyle[styleName];}else{return getComputedStyle(obj,null)[styleName];

}

}

上面是封装好一个函数，可以直接调用。

DIV是层叠样式表中的定位技术，全称DIVision，即为划分。有时可以称其为图层。DIV在编程中又叫做整除，即只得商的整数。 DIV元素是用来为HTML（标准通用标记语言下的一个应用）文档内大块（block-level）的内容提供结构和背景的元素。

<script type="text/javascript"> <!--

var winWidth = 0;

var winHeight = 0;

function findDimensions() //函数：获取尺寸

{

//获取窗口宽度

if (windowinnerWidth)

winWidth = windowinnerWidth;

else if ((documentbody) && (documentbodyclientWidth))

winWidth = documentbodyclientWidth;

//获取窗口高度

if (windowinnerHeight)

winHeight = windowinnerHeight;

else if ((documentbody) && (documentbodyclientHeight))

winHeight = documentbodyclientHeight;

//通过深入Document内部对body进行检测，获取窗口大小

if (documentdocumentElement && documentdocumentElementclientHeight &&

documentdocumentElementclientWidth)

{

winHeight = documentdocumentElementclientHeight;

winWidth = documentdocumentElementclientWidth;

}

//结果输出至两个文本框

documentform1availHeightvalue= winHeight;

documentform1availWidthvalue= winWidth;

}

findDimensions(); //调用函数，获取数值

windowonresize=findDimensions;

//-->

</script>

项目的需求是上传一张，然后验证该的尺寸，如果跟预期的不符，就不给上传

首先，可以通过new FileReader()，再通过将上传的文件传给实例的readAsDataUrl()，当文件加载完成触发onload事件，传递event，通过eventtargetresult来获取的链接(base64格式的)

接着，new Image()实例，将上面获取的链接设置为的src属性，当加载完成触发onload事件就可以通过width、height属性来读取的长宽啦~~

以上就是关于JS 获取当前浏览器宽高全部的内容，包括:JS 获取当前浏览器宽高、js怎样获取页面字节大小、怎么用js获取div的当前宽度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！