一、網頁的大小和瀏覽器視窗的大小
首先，要明確兩個基本概念。
一張網頁的全部面積，就是它的大小。通常情況下，網頁的大小由內容和css樣式表決定。
瀏覽器視窗的大小，則是指在瀏覽器視窗中看到的那部分網頁面積，又叫做viewport（視口）。
很顯然，如果網頁的內容能夠在瀏覽器視窗中全部顯示（也就是不出現滾動條），那麼網頁的大小和瀏覽器視窗的大小是相等的。如果不能全部顯示，則滾動瀏覽器視窗，可以顯示出網頁的各個部分。
二、獲取網頁的大小
網頁上的每個元素，都有clientheight和clientwidth屬性。這兩個屬性指元素的內容部分再加上padding的所佔據的視覺面積，不包括border和滾動條占用的空間。
（圖一 clientheight和clientwidth屬性）
因此，document元素的clientheight和clientwidth屬性，就代表了網頁的大小。
function getviewport()
} else }}
上面的getviewport函式就可以返回瀏覽器視窗的高和寬。使用的時候，有三個地方需要注意：
1）這個函式必須在頁面載入完成後才能執行，否則document物件還沒生成，瀏覽器會報錯。三、獲取網頁大小的另一種方法網頁上的每個元素還有scrollheight和scrollwidth屬性，指包含滾動條在內的該元素的視覺面積。2）大多數情況下，都是document.documentelement.clientwidth返回正確值。但是，在ie6的quirks模式中，document.body.clientwidth返回正確的值，因此函式中加入了對文件模式的判斷。
3）clientwidth和clientheight都是唯讀屬性，不能對它們賦值。
那麼，document物件的scrollheight和scrollwidth屬性就是網頁的大小，意思就是滾動條滾過的所有長度和寬度。
仿照getviewport()函式，可以寫出getpagearea()函式。
function getpagearea()
} else }}
但是，這個函式有乙個問題。如果網頁內容能夠在瀏覽器視窗中全部顯示，不出現滾動條，那麼網頁的clientwidth和scrollwidth應該相等。但是實際上，不同瀏覽器有不同的處理，這兩個值未必相等。所以，我們需要取它們之中較大的那個值，因此要對getpagearea()函式進行改寫。
function getpagearea()
} else }}
四、獲取網頁元素的絕對位置
網頁元素的絕對位置，指該元素的左上角相對於整張網頁左上角的座標。這個絕對位置要通過計算才能得到。
首先，每個元素都有offsettop和offsetleft屬性，表示該元素的左上角與父容器（offsetparent物件）左上角的距離。所以，只需要將這兩個值進行累加，就可以得到該元素的絕對座標。
（圖二 offsettop和offsetleft屬性）
下面兩個函式可以用來獲取絕對位置的橫座標和縱座標。
function getelementleft(element)
return actualleft;
}function getelementtop(element)
return actualtop;
}由於在**和iframe中，offsetparent物件未必等於父容器，所以上面的函式對於**和iframe中的元素不適用。
五、獲取網頁元素的相對位置
網頁元素的相對位置，指該元素左上角相對於瀏覽器視窗左上角的座標。
有了絕對位置以後，獲得相對位置就很容易了，只要將絕對座標減去頁面的滾動條滾動的距離就可以了。滾動條滾動的垂直距離，是document物件的scrolltop屬性；滾動條滾動的水平距離是document物件的scrollleft屬性。
（圖三 scrolltop和scrollleft屬性）
function getelementviewleft(element)
if (document.compatmode == "backcompat") else
return actualleft-elementscrollleft;
}function getelementviewtop(element)
if (document.compatmode == "backcompat") else
return actualtop-elementscrolltop;
}scrolltop和scrollleft屬性是可以賦值的，並且會立即自動滾動網頁到相應位置，因此可以利用它們改變網頁元素的相對位置。另外，element.scrollintoview()方法也有類似作用，可以使網頁元素出現在瀏覽器視窗的左上角。
六、獲取元素位置的快速方法
除了上面的函式以外，還有一種快速方法，可以立刻獲得網頁元素的位置。
那就是使用getboundingclientrect()方法。它返回乙個物件，其中包含了left、right、top、bottom四個屬性，分別對應了該元素的左上角和右下角相對於瀏覽器視窗（viewport）左上角的距離。
所以，網頁元素的相對位置就是
var x= this.getboundingclientrect().left;
var y =this.getboundingclientrect().top;
再加上滾動距離，就可以得到絕對位置
var x= this.getboundingclientrect().left+document.documentelement.scrollleft;
var y =this.getboundingclientrect().top+document.documentelement.scrolltop;
目前，ie、firefox 3.0+、opera 9.5+都支援該方法，而firefox 2.x、safari、chrome、konqueror不支援。
用Javascript獲取頁面元素的位置
1.網頁的大小和瀏覽器視窗的大小 一張網頁的全部面積，就是它的大小。通常情況下，網頁的大小由內容和css樣式表決定。瀏覽器視窗的大小，則是指在瀏覽器視窗中看到的那部分網頁面積，又叫做viewport 視口 如果網頁的內容能夠在瀏覽器視窗中全部顯示 也就是不出現滾動條 那麼網頁的大小和瀏覽器視窗的大小...
用Javascript獲取頁面元素的位置
一 網頁的大小和瀏覽器視窗的大小 首先，要明確兩個基本概念。一張網頁的全部面積，就是它的大小。通常情況下，網頁的大小由內容和css樣式表決定。瀏覽器視窗的大小，則是指在瀏覽器視窗中看到的那部分網頁面積，又叫做viewport 視口 很顯然，如果網頁的內容能夠在瀏覽器視窗中全部顯示 也就是不出現滾動條...
用Javascript獲取頁面元素的具體位置
一 網頁的大小和瀏覽器視窗的大小 首先，要明確兩個基本概念。一張網頁的全部面積，就是它的大小。通常情況下，網頁的大小由內容和css樣式表決定。瀏覽器視窗的大小，則是指在瀏覽器視窗中看到的那部分網頁面積，又叫做viewport 視口 很顯然，如果網頁的內容能夠在瀏覽器視窗中全部顯示 也就是不出現滾動條...