1. 程式人生 > >JS獲取瀏覽器中的各種寬高值

JS獲取瀏覽器中的各種寬高值

width:

clientWidth:物件實際內容的寬度,不包含邊線,最大不超過視口寬度
offsetWidth:物件實際寬度,包含邊線,最大不超過視口寬度
scrollWidth:物件實際寬度,不包含邊線,可超過視口寬度

height:(都可超過視口高度)

clientHeight:物件實際內容的高度,不包含邊線
offsetHeight:物件實際高度,包含邊線
scrollHeight:物件實際高度,不包含邊線。如果物件為body,大於視口時為實際高度,小於視口時為視口高度

解析度寬高:

window.screen.width:螢幕解析度寬度
window.screen.height:螢幕解析度高度
window.screen.availWidth:螢幕工作區寬度
window.screen.availHeight:螢幕工作區高度(不包含windows底邊欄)

滾動距離:

scrollTop:物件被捲去的高度
scrollLeft:物件被捲去的寬度

偏移值:

event.clientX:相對文件的橫向偏移值
event.clientY:相對文件的縱向偏移值
event.offsetX:相對當前物件的橫向偏移值
event.offsetY:相對當前物件的縱向偏移值
offsetLeft:相對父元素的橫向偏移值
offsetTop:相對父元素的縱向偏移值
window.screenTop:瀏覽器相對於螢幕左上角的橫向偏移值
window.screenLeft:瀏覽器相對於螢幕左上角的縱向偏移值

邊線: 滾動條和邊框

相關推薦

JS獲取瀏覽器各種

width: clientWidth:物件實際內容的寬度,不包含邊線,最大不超過視口寬度 offsetWidth:物件實際寬度,包含邊線,最大不超過視口寬度 scrollWidth:物件實際寬度,不包含邊線,可超過視口寬度 height:(都可超過視

你真的懂js獲取可視區

可能你會覺得獲取可視區寬高不是很簡單嗎 原生js獲取高度不就是就window.innerHeight一句話的事,可是真的這麼簡單嗎 來看個測試頁面,如果頁面帶有橫向縱向的滾動條,我們打印出各個高度進行檢視對比 順便你也可以看看document.body和document.document

Jquery和JS獲取ulli標籤的以及賦問題

通過點選li標籤,拿到li值,在把值賦給一個文字框 以下是HTML,以及input標籤 <input type="hidden" id="orderBy" value="${orderBy}" > <input type="hidd

js獲取上傳圖片

直接程式碼 <!DOCTYPE html> <html> <head> <title>獲取上傳圖片的寬高</title> </

Js獲取陣列的最大和最小

方法一:在陣列的原型上加方法 //最小值 Array.prototype.min = function() { var min = this[0]; var len = this.length; for (var i = 1;

js和jquery各種

自己 大堆 com pre fff 技術分享 bsp ges 窗口 js裏面的寬度太多了,一大堆的,的確需要好好的整理總結一下,不然自己就是一個亂的。 先看看window下面的寬高 1-- window.outerWidth window.outerHeight

js獲取各種

fun cti oct eve page 部分 屬性 char lan 1.窗口和瀏覽器 window.innerWidth、window.innerHeight 瀏覽器內部可用寬高 window.outerWidth、window.outerHeight 瀏覽器整

js獲取網頁各種

 網頁可見區域寬:document.body.clientWidth;                              $(window).width() ;  網頁可見區域高:document.body.clientHeight;            

js 獲取瀏覽器高度和寬度

工作 nth 目前 idt 可見 精確 滾動 獲取對象 nbsp IE中: document.body.clientWidth ==> BODY對象寬度 document.body.clientHeight ==> BODY對象高度 document.docum

js各種的總結

doc round highlight 20px ttr nth setw get 寬高 1.clientWidth和clientHeight指元素的可視部分寬度和高度,就是padding+content如果沒有滾動條,就是設定的寬度和高度 如果有滾動條,就是設定的寬度和

js獲取URL指定的

string 元素 每一個 cati 組元 brush func arc gets function getSearchString(key) { // 獲取URL中?之後的字符 var str = location.search; str = s

activity 獲取控件的

post oncreate div ams getheight width 方式 return override 1.第一種方式: TextView textview3 = findViewById(R.id.textview3); textView3.post(new

js獲取input所輸入的

-c scrip tle utf-8 element 輸入 pla ont button <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>

jquery獲取元素各種及頁面總結

轉載:https://www.cnblogs.com/goloving/p/7113567.html     $(function(){      var a = $("#div").width(),//width()返回元素的寬高,不包

js怎麼通過class獲取div的attr的

    求助:怎麼根據class類名,獲取樣式中display中的值啊?萬分感謝!!   補充解答: $(".window-shadow").css("display");(使用類選擇器) 該例項中涉及到子視窗和父視窗的知識 倘若設計了

js獲取url ,並跳轉相應頁面

實現方法:一:獲取URL帶QUESTRING引數的JAVASCRIPT客戶端解決方案,相當於asp的request.querystring,PHP的$_GET1.函式:<Script language="javascript">function GetRequest() {var url = lo

js獲取瀏覽器URL查詢字串的引數

js 使用split方法分隔字串,和java的split方法一模一樣。 function showWindowHref(){ var sHref = window.location.href; var args = sHref.split('?');

原生JS相容所有瀏覽器獲取瀏覽器高度和寬度,響應式佈局 js 獲取瀏覽器高度和寬度(相容多瀏覽器)

var width = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth;

js獲取html真實舞臺

var winSize = {width:document.documentElement.clientWidth,height:document.documentElement.clientHeight};   var winWidth = 0; var winH

JS獲取瀏覽器位址列的多個引數值的任意例項程式碼

下面通過一段程式碼給大家介紹js獲取瀏覽器位址列的多個引數值的任意值,具體程式碼如下所示: getParamValue("id"); //http://localhost:2426/TransactionNotes.aspx?id=100 //返回值是100;