js獲取網頁各種寬高
網頁可見區域寬：document.body.clientWidth;
$(window).width() ；
網頁可見區域高：document.body.clientHeight;
$(window).height() ；
網頁可見區域寬： document.body.offsetWidth + " （包含邊線和遷移轉變條的寬）";
網頁可見區域高： document.body.offsetHeight + " （包含邊線的寬）";
網頁正文全文寬： document.body.scrollWidth;
$(document).width() ;
window.innerWidth ;
網頁正文全文高： document.body.scrollHeight;
$(document).height() ;
window.innerHeight ;
網頁被捲去的高（ff） document.body.scrollTop;
$(window).scrollTop() ；
網頁被捲去的高（ie）： document.documentElement.scrollTop;
網頁被捲去的左： document.body.scrollLeft;
$(window).scrollLeft() ；
瀏覽器視窗相對於螢幕的上位置（除ff外的瀏覽器適用）： window.screenTop;
瀏覽器視窗相對於螢幕的左位置（除ff外的瀏覽器適用）： window.screenLeft;
瀏覽器視窗相對於螢幕的上位置（所有瀏覽器適用）：window.screenY;
瀏覽器視窗相對於螢幕的左位置（所有瀏覽器適用）： window.screenX;
螢幕辨別率的高： window.screen.height;
螢幕辨別率的寬： window.screen.width;
螢幕可用工作區高度： window.screen.availHeight;
螢幕可用工作區寬度： window.screen.availWidth;
你的螢幕設定是： window.screen.colorDepth +" 位彩色";
你的螢幕設定 ： window.screen.deviceXDPI +" 畫素/英寸";
本來是W3C的標準在作怪啊
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
文件型別如果定義了DTD的話
document.body.clientWidth =》0
document.body.clientHeight =》0
可使用：
document.documentElement.clientWidth
document.documentElement.clientHeight
代替獲取可視寬高；
相反如果<!DOCTYPE>中沒有定義DTD，則：
document.documentElement.clientWidth=》0
document.documentElement.clientHeight=》0
可使用：
document.body.clientWidth
document.body.clientHeight
代替獲取可視寬高；
為達到通用性可使用如下程式碼：var clientWidth = document.documentElement.clientWidth || document.body.clientWidth || 0;
var clientHeight = document.documentElement.clientHeight || document.body.clientHeight || 0;
網頁可見區域寬： document.body.clientWidth; 網頁可見區域高： document.body.clientHeight; 網頁可見區域寬： document.body.offsetWidth （包含邊線和遷移轉變條的寬）; 網頁可見區域高： document.body.offsetHeight （包含邊線的寬）; 網頁正文全文寬： document.body.scrollWidth; 網頁正文全文高： document.body.scrollHeight; 網頁被捲去的高（ff）：document.body.scrollTop; 網頁被捲去的高（ie）: document.documentElement.scrollTop; 網頁被捲去的左：document.body.scrollLeft; 網頁正文專案組上：window.screenTop; 網頁正文專案組左：window.screenLeft; 某個元素的寬度：obj.offsetWidth; 某個元素的高度：obj.offsetHeight; 某個元素的上鴻溝到body最頂部的間隔：obj.offsetTop;（在元素的包含元素不含遷移轉變條的景象下） 某個元素的左鴻溝到body最左邊的間隔：obj.offsetLeft;（在元素的包含元素不含遷移轉變條的景象下） 返回當前元素的上鴻溝到它的包含元素的上鴻溝的偏移量：obj.offsetTop（在元素的包含元素含遷移轉變條的景象下） 返回當前元素的左鴻溝到它的包含元素的左鴻溝的偏移量：obj.offsetLeft（在元素的包含元素含遷移轉變條的景象下）
- scrollTop， scrollLeft
- 設定或返回已經遷移轉變到元素的左鴻溝或上鴻溝的畫素數。只有在元素有遷移轉變條的時辰，例如，元素的 CSS overflow 屬性設定為 auto 的時辰，這些畫素才有效。這些屬性也只在文件的 <body> 或 <html> 標識表記標幟上定義（這和瀏覽器有關），並且一路來制訂遷移轉變文件的地位。重視，這些屬性並不會指定一個 <iframe> 標識表記標幟的遷移轉變數。這長短標準的但卻獲得很好支撐的屬性
JS獲取各種高度寬度：瀏覽器視窗滾動條的位置、元素的幾何尺寸
1）關於 pageX, clienX,offsetX,layerX
-
pageX：滑鼠在頁面上的位置，從頁面左上角開始，即是以頁面為參考點，不隨滑動條移動而變化
-
clientX：滑鼠在頁面上可視區域的位置，從瀏覽器可視區域左上角開始，即是以瀏覽器滑動條此刻的滑動到的位置為參考點,隨滑動條移動 而變化.
-
offsetX：IE特有,滑鼠相比較於觸發事件的元素的位置,以元素盒子模型的內容區域的左上角為參考點,如果有boder,可能出現負值
-
layerX：FF特有,滑鼠相比較於當前座標系的位置,即如果觸發元素沒有設定絕對定位或相對定位,以頁面為參考點,如果有,將改變參考座標系,從觸發元素盒子模型的border區域的左上角為參考點，也就是當觸發元素設定了相對或者絕對定位後,layerX和offsetX就相等。
2）關於元素尺寸、位置和溢位的更多資訊
-
只讀屬性offsetWidth和offsetHeight：以css畫素返回它的螢幕尺寸。返回尺寸包含元素的邊框以內，出去外邊距。
-
offsetLeft和offsetTop屬性：返回元素的X和Y座標。offsetParent屬性指定這個屬性相對的父元素。
-
ClientWidth和clientHeight：類似offsetWidth和offsetHeight，不同的是不包含邊框大小，只包含內邊距以內。如果瀏覽器在內邊距和邊框之間添加了滾動條，還不會包含滾動條。注意，<i>和<code>和<span>這類內聯元素，clientWidth和clientHeight總是返回0；
-
clientLeft和clientTop屬性：沒什麼用，返回內邊距的外邊緣和邊框的外邊緣之間水平距離和垂直距離。
-
scrollWidth和scrollHeight：內容+內邊距+溢位。當無溢位時，和clientWidth和clientHeight相等。
-
scrollLeft和scrollTop：是滾動條位置。
3）查詢元素的幾何尺寸
-
判斷一個元素最簡單的方法是呼叫它的getBoundingClientRect()方法。該方法在IE5中引入，而在現在所有瀏覽器中都實現了。返回一個有left right top bottom 等屬性的物件。left top表示元素左上角的X和Y座標，right bottom屬性表示元素的右下角的X和Y座標。
-
4）判斷瀏覽器視窗滾動條的位置
-
所有瀏覽器支援window.pageXOffset和window.pageYOffset. 除了IE8以下，所有支援scrollLeft和scrollTop;
-
-
document.compatMode // 有兩種可能的返回值：BackCompat和CSS1Compat，對其解釋如下： ［BackCompat］Standards-compliant mode is not switched on. (Quirks Mode) ［CSS1Compat］ Standards-compliant mode is switched on. (Standards Mode)
5）設定滑鼠滾動值
-
方法一：scrollLeft和scrollTop屬性可以用來設定瀏覽器滾動，如 document.body.scrollTop = 100；
-
方法二：在jquery中，使用.scrollTop(value) 和 .scrollLeft() 來設定scrollTop的值。
相關DEMO展示：
| 1 | document.getElementsByClassName("js-new-issue-button")[0].style.width |
| 2 | // "84px" |
| 3 | document.getElementsByClassName("js-new-issue-button")[0].clientWidth |
| 4 | // 104 |
| 5 | $(".w_content .product_piece img").css("width"); |
| 6 | // "165px" |
| 7 | $(".w_content .product_piece img").width(); |
| 8 | // 165 |
//獲取元素的縱座標
| 1 | function getTop(e){ |
| 2 | var offset=e.offsetTop; |
| 3 | if(e.offsetParent!=null) |
| 4 | offset+=getTop(e.offsetParent); |
| 5 | return offset; |
| 6 | } |
//獲取元素的橫座標
| 1 | function getLeft(e){ |
| 2 | var offset=e.offsetLeft; |
| 3 | if(e.offsetParent!=null) |
| 4 | offset+=getLeft(e.offsetParent); |
| 5 | return offset; |
| 6 | } |
獲取高度時在iPad中遇到問題：
要做自適應，並且隨著螢幕顛來倒去改變選單高度的效果，於是在ipad上遇到了糾結的問題：
螢幕工作區高度：window.screen.height（在ipad中，旋轉螢幕時，該值不會發生變化）
螢幕工作區寬度：window.screen.width（在ipad中，旋轉螢幕時，該值不會發生變化）
螢幕可用工作區高度：window.screen.availHeight （在ipad中，旋轉螢幕時，該值不會發生變化）
螢幕可用工作區寬度：window.screen.availWidth（在ipad中，旋轉螢幕時，該值不會發生變化）
$(window).height() // 在ipad中獲取的高度會與pc上預期的不一樣，有一個（ 螢幕工作區高度 - 螢幕可用工作區高度）的偏差
$(window).width() // 在ipad中獲取的寬度會與pc上預期的不一樣，有一個（ 螢幕工作區寬度 - 螢幕可用工作區寬度）的偏差
在沒有宣告DOCTYPE的IE中，瀏覽器顯示視窗大小隻能以下獲取：
document.body.offsetWidth document.body.offsetHeight
在聲明瞭DOCTYPE的瀏覽器中，可以用以下來獲取瀏覽器顯示視窗大小：
document.documentElement.clientWidth document.documentElement.clientHeight
IE，FF，Safari皆支援該方法，opera雖支援該屬性，但是返回的是頁面尺寸；
同時，除了IE以外的所有瀏覽器都將此資訊儲存在window物件中，可以用以下獲取：
window.innerWidth window.innerHeight
相關推薦
js獲取網頁各種寬高
網頁可見區域寬：document.body.clientWidth; $(window).width() ； 網頁可見區域高：document.body.clientHeight;
jquery或者js獲取到元素寬高精確到小數
OS 模式 idt alert 新版 老版本 保留 兼容ie rom 首先我們應該知道用jQuery的width()方法獲取元素的寬高及樣式屬性數值時，如果元素的屬性是浮點數，會自動四舍五入成整數。 而如果我們就是想獲取實際的帶小數的屬性數值時該用什麽方法。 在使用獲取
jquery獲取元素各種寬高及頁面寬高總結
轉載：https://www.cnblogs.com/goloving/p/7113567.html $(function(){ var a = $("#div").width(),//width()返回元素的寬高，不包
JS 獲取html元素寬高 及設定寬高
獲取瀏覽器的寬高： var width = window.innerWidth || document.documentElement.clientWidth || document.body.cl
JS獲取螢幕的寬高。
<html> <script> function a(){ document.write( "螢幕解析度為："+screen.width+"*"+screen.height +"<br />"+ "螢幕可用大小："+screen.ava
js獲取各種寬高
fun cti oct eve page 部分 屬性 char lan 1.窗口和瀏覽器 window.innerWidth、window.innerHeight 瀏覽器內部可用寬高 window.outerWidth、window.outerHeight 瀏覽器整
JS獲取網頁的高和寬 以及 點選按鈕回到頂部動畫
網頁可見區域寬： document.body.clientWidth 網頁可見區域高： document.body.clientHeight 網頁可見區域寬： document.body.offsetWidth (包括邊線的寬) 網頁可見區域高： document.body.offsetHe
JS獲取瀏覽器中的各種寬高值
width： clientWidth：物件實際內容的寬度，不包含邊線，最大不超過視口寬度 offsetWidth：物件實際寬度，包含邊線，最大不超過視口寬度 scrollWidth：物件實際寬度，不包含邊線，可超過視口寬度 height：（都可超過視
JS獲取網頁寬高方法集合
JS獲取網頁寬高等方法的集合：document.body.clientWidth - 網頁可見區域寬document.body.clientHeight - 網頁可見區域高document.body.offsetWidth - 網頁可見區域寬，包括邊線和滾動條的寬docume
js和jquery中的各種寬高
自己 大堆 com pre fff 技術分享 bsp ges 窗口 js裏面的寬度太多了，一大堆的，的確需要好好的整理總結一下，不然自己就是一個亂的。 先看看window下面的寬高 1-- window.outerWidth window.outerHeight
js各種寬高的總結
doc round highlight 20px ttr nth setw get 寬高 1.clientWidth和clientHeight指元素的可視部分寬度和高度，就是padding+content如果沒有滾動條，就是設定的寬度和高度 如果有滾動條，就是設定的寬度和
【整理】原生js和jQ獲取窗口寬高及滾動條的方法和函數
javascript 滾動條 jq 窗口距離 原生js和jQ獲取窗口寬高及滾動條的方法和函數 一。原生js獲取 1.實際寬高（不包括工具欄，滾動條的視口高度，ie6.7.8不支持） window.innerHeight window.innerWidth 2.顯示屏寬高 screen.h
js：網頁中的高和寬（document）
冒泡 Language ntop int border dom html tee play 一，此例中通過鼠標點擊事件在網頁的中心位置創建一個盒子，不管瀏覽器變小，或是有卷曲的網頁，盒子都會在瀏覽器正中央 主要方法：clientWidth方法獲取當前可見網頁的寬度
js獲取canvas 的寬和高，到底是多少？
h5新標籤canvas用於繪製圖像，但是，你知道嗎,js獲取canvas的寬到底是多少？ canvas.width獲取的是寫在標籤屬性中的寬度值，eg :<canvas width="800"
獲取屏幕寬高width(),outerWidth,innerWidth,documentElement.clientWidth, body.clientWidth的區別
360瀏覽器 低版本 return parent etl 設置 html head () 基本介紹 $(window).width()與$(window).height() $(window).width()與$(window).height()：獲得的是屏幕可視區域的
背景圖片拉伸，計算屏幕寬度和獲取控件寬高
屏幕寬度 ack context splay ots focus pri bool thp 背景圖片拉伸： 那麽如果我們想在Activity的onCreate方法或者是onReusme方法獲取組件的寬高怎麽辦呢？這裏提供了以下的五種方式：http://blog.csdn.
獲取屏幕寬高
inner mar mac ref 瀏覽器 ipp hive return view 做手機Web開發做瀏覽器兼容用到了，所以在網上找了些匯總下。 alert($(window).height()); //瀏覽器當前窗口可視區域高度 alert($(document)
在onload事件前獲取圖片的寬高
get 創建對象 UNC 後臺 set 避免 trap 記錄 val 有時候在獲取從後臺的圖片時，要對圖片進行一系列的處理，才渲染出來 我們要解決的是沒有緩存而又快速的相比onload更快的方式去獲取圖片的寬高，接下來上代碼 通過定時循環檢測獲取： // 記錄當前時間戳 v
WPF 獲取屏幕分辨率（獲取最大寬高）等
工作區 通過 recorder 是否 操作 start doc clas 靜態屬性 原文:WPF 獲取屏幕分辨率（獲取最大寬高）等 double x = SystemParameters.WorkArea.Width;//得到屏幕工作區域寬度 double y = Sy
前端Js獲取網頁位址列引數！
function get(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.s