js獲取瀏覽器和屏幕的各種寬度高度

更新時(shí)間：2017年02月22日 17:14:48 作者：托馬斯沒有小火車

本文主要介紹了js獲取瀏覽器和屏幕的各種寬度高度的方法，具有很好的參考價(jià)值，下面跟著小編一起來看下吧

一：網(wǎng)頁可見區(qū)域?qū)捀?，不包括工具欄和滾動(dòng)條（瀏覽器窗口可視區(qū)域大小）

1.對(duì)于IE9+、chrome、firefox、Opera、Safari：

window.innerHeight瀏覽器窗口的內(nèi)部高度；

window.innerWidth瀏覽器窗口的內(nèi)部寬度；

2.對(duì)于IE8.7.6.5:

document.documentElement.clientHeight:表示HTML文檔所在窗口的當(dāng)前高度；

document.documentElement.clientWidth:表示HTML文檔所在窗口的當(dāng)前寬度；

或者，因?yàn)閐ocument對(duì)象的body屬性對(duì)應(yīng)HTML文檔的<body>標(biāo)簽，所以也可表示為：

document.body.clientHeight：表示HTML文檔所在窗口的當(dāng)前高度；

document.body.clientWidth：表示HTML文檔所在窗口的當(dāng)前寬度；

結(jié)論：

document.body.clientWidth/Height：的寬高偏小，高甚至默認(rèn)200；

document.documentElement.clientWidth/Height 和 window.innerWidth/Height 的寬高始終相等。

所以在不同瀏覽器都實(shí)用的的Javascripit方案：

var w = document.documentElement.clientWidth || document.body.clientWidth;
var h = document.documentElement.clientHeight || document.body.clientHeight;

二：網(wǎng)頁正文全文寬高

scrollWidth和scrollHeight獲取網(wǎng)頁內(nèi)容高度和寬度

1.針對(duì)IE.Opera：scrollHeight是網(wǎng)頁內(nèi)容實(shí)際高度，可以小于clientHeight;

2.針對(duì)NS.firefox：scrollHeight是網(wǎng)頁內(nèi)容高度，不過最小值是clientHeight;也就是說網(wǎng)頁內(nèi)容實(shí)際高度小于clientHeight的時(shí)候，scrollHeight返回clientHeight；

3.瀏覽器兼容代碼：

var w = document.documentElement.scrollWidth || document.body.scrollWidth;
var h = document.documentElement.scrollHeight || document.body.scrollHeight;

二：網(wǎng)頁可見區(qū)域?qū)捀?，包括滾動(dòng)條等邊線（會(huì)隨窗口的顯示大小改變）

1.值： offsetWidth = scrollWidth + 左右滾動(dòng)條 +左右邊框；

　　　　offsetHeight = scrollHeight + 上下滾動(dòng)條 + 上下邊框；

2.瀏覽器兼容代碼：

var w = document.documentElement.offsetWidth || document.body.offsetWidth ;
var h = document.documentElement.offsetHeight || document.body.offsetHeight ;

三：網(wǎng)頁卷去的距離與偏移量

1.scrollLeft:設(shè)置或獲取位于給定對(duì)象左邊界與窗口中目前可見內(nèi)容的最左端之間的距離；

2.scrollTop:設(shè)置或獲取位于給定對(duì)象最頂端與窗口中目前可見內(nèi)容的最左端之間的距離；

3.offsetLeft:設(shè)置或獲取位于給定對(duì)象相對(duì)于版面或由offsetParent屬性指定的父坐標(biāo)的計(jì)算左側(cè)位置；

4.offsetTop:設(shè)置或獲取位于給定對(duì)象相對(duì)于版面或由offsetParent屬性指定的父坐標(biāo)的計(jì)算頂端位置；

以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時(shí)也希望多多支持腳本之家！

您可能感興趣的文章: