取得窗口大小 兼容所有瀏覽器的js代碼
更新時間：2011年08月09日 20:05:40 作者：
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。
取得窗口大小的代碼：
var pageWidth = window.innerWidth,
var pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){
if(document.compatMode == "number"){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else{
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。然后檢查pageWidth中保存的是不是一個數(shù)值；如果不是，則通過document.compatMode來確定頁面是否處于標(biāo)準模式。如果是，則分別使用document.documentElement.clientWidth和document.documentElement.clientHeight的值。否則，就使用document.body.clientWidth和document.body.clientHeight的值。
取得窗口位置的代碼：
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
這兩個例子目的是取得窗口左邊和上邊的位置，首先運用二元操作符判斷screenLeft屬性和screenTops屬性是否存在，如果存在（在IE、Safari、Opera和Chrome中），則取這兩個屬性的值。如果不存在（在Firefox中），則取screenX和screenY的值。
復(fù)制代碼 代碼如下:
var pageWidth = window.innerWidth,
var pageHeight = window.innerHeight;
if(typeof pageWidth != "number"){
if(document.compatMode == "number"){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else{
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
我們首先把window.innerWidth和window.innerHeight的值分別付給了pageWidth和pageHeight。然后檢查pageWidth中保存的是不是一個數(shù)值；如果不是，則通過document.compatMode來確定頁面是否處于標(biāo)準模式。如果是，則分別使用document.documentElement.clientWidth和document.documentElement.clientHeight的值。否則，就使用document.body.clientWidth和document.body.clientHeight的值。
取得窗口位置的代碼：
復(fù)制代碼 代碼如下:
var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
這兩個例子目的是取得窗口左邊和上邊的位置，首先運用二元操作符判斷screenLeft屬性和screenTops屬性是否存在，如果存在（在IE、Safari、Opera和Chrome中），則取這兩個屬性的值。如果不存在（在Firefox中），則取screenX和screenY的值。
相關(guān)文章
js中位數(shù)不足自動補位擴展padLeft、padRight實現(xiàn)代碼
這篇文章主要介紹了js中位數(shù)不足自動補位擴展之padLeft、padRight實現(xiàn)方法，主要是通過String.prototype擴展實現(xiàn),需要的朋友可以參考下2020-04-04
javascript數(shù)組元素刪除方法delete和splice解析
這篇文章主要介紹了javascaipt數(shù)組元素刪除方法delete和splice解析,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-12-12
這篇文章主要給大家介紹了關(guān)于用JavaScript做一個簡易計算器的三種方法,JS中實現(xiàn)一個簡單的計算器并不困難,我們只需利用基本的數(shù)學(xué)運算符和JavaScript的語法即可,需要的朋友可以參考下2023-10-10
這篇文章主要介紹了如何獲取TypeScript的聲明文件.d.ts 的相關(guān)知識，非常不錯，具有參考借鑒價值，需要的朋友參考下2018-05-05
這篇文章主要介紹了JavaScript閉包原理與用法,結(jié)合實例形式詳細分析了JavaScript閉包相關(guān)概念、原理、用法及操作注意事項,需要的朋友可以參考下2020-05-05
本篇文章主要介紹了tween.js緩動補間動畫示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-02-02
這篇文章主要和大家聊一聊JavaScript的New關(guān)鍵字，一般我們通過New關(guān)鍵字來創(chuàng)建一個類的實例對象，感興趣的小伙伴們可以參考一下2016-08-08
js文件中調(diào)用js的實現(xiàn)方法小結(jié)
JavaScript文件引用JavaScript文件的方法，需要的朋友可以參考下。2009-10-10
微信小程序誕生之初,功能受限于小程序的理念,微信小程序要體現(xiàn)輕量級的應(yīng)用特點,但在隨后不斷更新中,API接口很好的為小程序賦能,使其可以在不影響本質(zhì)的情況下實現(xiàn)完善功能,這篇文章主要給大家介紹了關(guān)于微信小程序中正確使用地圖的相關(guān)資料,需要的朋友可以參考下2021-09-09
js 剪切板的用法(clipboardData.setData)與js match函數(shù)介紹
這篇文章主要是對js中剪切板的使用方法(clipboardData.setData)與js中的match函數(shù)進行了介紹。需要的朋友可以過來參考下，希望對大家有所幫助2013-11-11