IE9+、Firefox、Safari、Opera、和 Chrome 均提供4個屬性：innerWidth、innerHeight、outerWidth 和 outerHeight。

1.在IE9+、Firefox、Safari中，outerHeight/outerWidth返回瀏覽器視窗本身的大小（無論是從最外層的 window 物件還是從某個框架訪問。）

2.在 Opera 中，outerHeight/outerWidth表示頁面檢視容器（ Opera 中單個標籤頁對應的瀏覽器視窗）的大小;而innerHeight/innerWidth表示該容器中頁面試圖去的大小（減去邊框寬度）。

3.在 Chrome 中，outerHeight/outerWidth 與 innerHeight/innerWidth 返回相同的值，即視口（viewport）大小而非瀏覽器視窗大小。

在 IE9+、Firefox、Safari、Opera、和 Chrome中，document.documentElement.clientWidth 和 document.documentElement.clientHeight中儲存了頁面視口的資訊。但是在 IE6 中，這些屬性必須在標準模式下才有效；若是在混雜模式下，就必須通過document.body.clientWidth 和 document.body.clientHeight

雖然最終無法取得確定瀏覽器視窗本身的大小，但卻可以取得頁面視口的大小：

var pageWidth = window.innerWidth,
    pageHeight = window.innerHeight;

if(typeof pageWidth != "number"){
    if(document.compatMode == "CSS1Compat"){
        pageWidth = document.documentElement.clientWidth;
        pageHeight = document.documentElement.clientHeight;
    }else{
        pageWidth = document.body.clientWidth;
        pageHeight = document.body.clientHeight;
    }               
}
 

程式碼解釋：
1.通過檢查 document.compatMode == "CSS1Compat" 來確定頁面是否處於標準模式。

對於移動裝置，window.innerWidth 和 window.innerHeight 儲存著可見視口，也就是螢幕上可見頁面區域的大小。移動 IE 瀏覽器不支援這些屬性，但通過 document.documentElement.clientWidth 和 document.documentElement.clientHeight 提供了相同的資訊。隨著頁面的縮放，這些值也會相應變化。在其他移動瀏覽器中，document.documentElement 度量的是佈局視口，即渲染後頁面的實際大小（與可見視口不同，可見視口只是整個頁面中的一小部分。）移動 IE 瀏覽器把佈局視口的資訊儲存在 document.body.clientWidth 和 document.body.clientHeight 中。這些值不會隨著頁面縮放變化。
由於與桌面瀏覽器間存在這些差異，最好先檢測一下使用者是否在使用移動裝置，然後再決定使用哪個屬性。

調整瀏覽器視窗大小的方法：

1.resizeTo() ：接收瀏覽器視窗的新寬度和新高度；

//調整到100*100
window.resizeTo(100,100);

2.resizeBy()：接收新視窗與原視窗的寬度和高度之差。

//調整到200*150
window.resizeBy(100,50);