js獲得頁(yè)面的高度和寬度的方法
更新時(shí)間：2014年02月23日 16:07:17 作者：
做一個(gè)彈出dialog時(shí)用到了取父頁(yè)面的寬度和高度的方法,需要的朋友可以參考下
今天在做一個(gè)彈出dialog時(shí)，遇用到了取父頁(yè)面的寬度和高度的方法。
嘗試了幾種方式，比如document.body.clientWidth，window.screen.width，document.body.scrollWidth等方法之后，發(fā)現(xiàn)都不是我想要的結(jié)果，后來(lái)發(fā)現(xiàn)了一個(gè)高效的方法，立刻大家分享之：
在需要取高度和寬度的地方加斷點(diǎn)調(diào)試【debugger】，然后在監(jiān)控頁(yè)面里面輸入document.body，查看所有body的屬性看看哪個(gè)結(jié)果是自己需要的，如果沒(méi)有適合還可以輸入window，然后看看window下是否有適合的屬性，今天我的問(wèn)題解決就是通過(guò)這種方式解決的，屬性是window.innerWidth和window.innerHeight。
希望大家遇到此類問(wèn)題的時(shí)候能少走彎路。
嘗試了幾種方式，比如document.body.clientWidth，window.screen.width，document.body.scrollWidth等方法之后，發(fā)現(xiàn)都不是我想要的結(jié)果，后來(lái)發(fā)現(xiàn)了一個(gè)高效的方法，立刻大家分享之：
在需要取高度和寬度的地方加斷點(diǎn)調(diào)試【debugger】，然后在監(jiān)控頁(yè)面里面輸入document.body，查看所有body的屬性看看哪個(gè)結(jié)果是自己需要的，如果沒(méi)有適合還可以輸入window，然后看看window下是否有適合的屬性，今天我的問(wèn)題解決就是通過(guò)這種方式解決的，屬性是window.innerWidth和window.innerHeight。
希望大家遇到此類問(wèn)題的時(shí)候能少走彎路。
您可能感興趣的文章:
- 準(zhǔn)確獲得頁(yè)面、窗口高度及寬度的JS
- jquery 得到當(dāng)前頁(yè)面高度和寬度的兩個(gè)函數(shù)
- 用js來(lái)定義瀏覽器中一個(gè)左右浮動(dòng)元素相對(duì)于頁(yè)面主體寬度的位置的函數(shù)
- js 獲取頁(yè)面高度和寬度兼容 ie firefox chrome等
- jquery實(shí)現(xiàn)在頁(yè)面加載完畢后獲取圖片高度或?qū)挾?/a>
- jquery實(shí)現(xiàn)類似EasyUI的頁(yè)面布局可改變左右的寬度
- js獲取input長(zhǎng)度并根據(jù)頁(yè)面寬度設(shè)置其大小及居中對(duì)齊
- 手機(jī)端頁(yè)面rem寬度自適應(yīng)腳本
- jQuery獲取頁(yè)面及個(gè)元素高度、寬度的總結(jié)——超實(shí)用
- 手機(jī)屏幕尺寸測(cè)試——手機(jī)的實(shí)際顯示頁(yè)面的寬度
相關(guān)文章
JS實(shí)現(xiàn)的相冊(cè)圖片左右滾動(dòng)完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)的相冊(cè)圖片左右滾動(dòng)效果,結(jié)合完整實(shí)例形式分析了javascript事件觸發(fā)與頁(yè)面元素屬性動(dòng)態(tài)變換的相關(guān)操作技巧,需要的朋友可以參考下2016-11-11
一直都是簡(jiǎn)單去js實(shí)現(xiàn)cookie的一些操作,今天把js對(duì)cookie操作系統(tǒng)的整理了一遍,包括:js讀取cookie,js添加cookie,js刪除cookie2012-12-12
支付寶小程序從手動(dòng)埋點(diǎn)到自動(dòng)埋點(diǎn)的實(shí)現(xiàn)過(guò)程
埋點(diǎn)的意思是在你想要的數(shù)據(jù)節(jié)點(diǎn)出進(jìn)行設(shè)置,可以方便進(jìn)行采集,下面這篇文章主要給大家介紹了關(guān)于支付寶小程序從手動(dòng)埋點(diǎn)到自動(dòng)埋點(diǎn)的相關(guān)資料,需要的朋友可以參考下2022-03-03
JavaScript正則表達(dá)式exec/g實(shí)現(xiàn)多次循環(huán)用法示例
這篇文章主要介紹了JavaScript正則表達(dá)式exec/g實(shí)現(xiàn)多次循環(huán)用法,結(jié)合實(shí)例形式分析了javascript正則表達(dá)式g修飾符相關(guān)使用技巧,需要的朋友可以參考下2017-01-01
本文詳細(xì)介紹了通過(guò)js+plupload實(shí)現(xiàn)了繞過(guò)服務(wù)器，向又拍云批量上傳圖片的解決方法，十分的巧妙，也節(jié)省了服務(wù)器資源，這里推薦給有需要的小伙伴。2014-12-12
JavaScript隨機(jī)打亂數(shù)組順序之隨機(jī)洗牌算法
這篇文章主要介紹了JavaScript隨機(jī)打亂數(shù)組順序之隨機(jī)洗牌算法的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
JS實(shí)現(xiàn)的簡(jiǎn)單鼠標(biāo)跟隨DiV層效果完整實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)的簡(jiǎn)單鼠標(biāo)跟隨DiV層效果,涉及JavaScript基于時(shí)間函數(shù)動(dòng)態(tài)操作頁(yè)面元素屬性的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10
js中Array.sort()方法是用來(lái)對(duì)數(shù)組項(xiàng)進(jìn)行排序的,默認(rèn)是升序排列sort() 方法可以接受一個(gè) 方法為參數(shù)，這個(gè)方法有兩個(gè)參數(shù)，接下來(lái)本例將對(duì)sort方法進(jìn)行深入探討，感興趣的朋友可以參考下2013-02-02
這篇文章主要介紹了JavaScript File分段上傳的相關(guān)資料,需要的朋友可以參考下2016-03-03
JavaScript 中Date對(duì)象的格式化代碼方法匯總
JavaScript默認(rèn)的時(shí)間格式我們一般情況下不會(huì)用，所以需要進(jìn)行格式化，下面小編給大家?guī)?lái)了三種js date對(duì)象格式化實(shí)例代碼，需要的朋友參考下吧2017-09-09