js和jquery獲取屏幕寬高以及加margin和padding等邊距的寬高

Javascript:

網頁可見區域寬： document.body.clientWidth
網頁可見區域高： document.body.clientHeight
網頁可見區域寬： document.body.offsetWidth (包括邊線的寬)
網頁可見區域高： document.body.offsetHeight (包括邊線的高)
網頁正文全文寬： document.body.scrollWidth
網頁正文全文高： document.body.scrollHeight
網頁被捲去的高： document.body.scrollTop
網頁被捲去的左： document.body.scrollLeft
網頁正文部分上： window.screenTop
網頁正文部分左： window.screenLeft
屏幕解析度的高： window.screen.height
屏幕解析度的寬： window.screen.width
屏幕可用工作區高度： window.screen.availHeight
屏幕可用工作區寬度： window.screen.availWidth

　JQuery

$(document).ready(function(){
$(window).height(); //瀏覽器當前視窗可視區域高度
$(document).height(); //瀏覽器當前視窗文檔的高度
$(document.body).height();//瀏覽器當前視窗文檔body的高度
$(document.body).outerHeight(true);//瀏覽器當前視窗文檔body的總高度 包括border padding margin

$(window).width(); //瀏覽器當前視窗可視區域寬度
$(document).width();//瀏覽器當前視窗文檔對象寬度
$(document.body).width();//瀏覽器當前視窗文檔body的寬度
$(document.body).outerWidth(true);//瀏覽器當前視窗文檔body的總寬度 包括border padding margin

})

　　div的寬高：

$(function(){
        $("div").width();//div的width
        $("div").innerWidth();//div的padding+width
        $("div").outerWidth();//div的padding+width+border
        $("div").outerWidth(true);//div的padding+width+border+margin
        
        $("div").height(); //div的height   
        $("div").innerHeight();//div的padding+height
        $("div").outerHeight();//div的padding+height+border
        $("div").outerHeight(true);//div的padding+height+border+margin
})