Js與Jq獲取瀏覽器和對(duì)象值的方法
JS and Jquery 都能獲取頁(yè)面元素的寬度,高度和相對(duì)位移等數(shù)值,那他們之間能相互轉(zhuǎn)換或替代嗎,寫(xiě)法又有哪些差異呢?本文將詳細(xì)為你介紹。
1.Js獲取瀏覽器高度和寬度
document.documentElement.clientWidth ==> 瀏覽器可見(jiàn)區(qū)域?qū)挾?
document.documentElement.clientHeight ==> 瀏覽器可見(jiàn)區(qū)域高度
document.body.clientWidth ==> BODY對(duì)象寬度
document.body.clientHeight ==> BODY對(duì)象高度
Jq獲取瀏覽器高度和寬度
$(window).width() ==> 瀏覽器可見(jiàn)區(qū)域?qū)挾?br />
$(window).height() ==> 瀏覽器可見(jiàn)區(qū)域高度
$(document).height() ==> 頁(yè)面文檔的高度
$(document.body).height() ==> BODY對(duì)象高度
2.Js獲取對(duì)象的高度和寬度
obj.width = obj.style.width
obj.clientWidth = width + padding ==> 獲得包括內(nèi)邊界(padding)的元素寬度
obj.offsetHeight = height + padding + border ==> 獲得包括內(nèi)邊界(padding)和邊框(border)的元素高度
Jq獲取對(duì)象的高度和寬度
obj.innerWidth() ==> 獲得包括內(nèi)邊界(padding)的元素寬度,
obj.outerWidth() ==> 獲得包括內(nèi)邊界(padding)和邊框(border)的元素寬度
obj.outerWidth(true) ==> 獲得包括外邊界(margin)的元素寬度
w同一個(gè)元素應(yīng)該是:width()<=innerWidth()<=outerWidth()<=outerWidth(true);
3.Js 獲取對(duì)象的相對(duì)高度和寬度
obj.offsetLeft ==> 元素相對(duì)于父元素的left
obj.offsettop ==> 元素相對(duì)于父元素的top
obj.scrollWidth ==> 獲取對(duì)象的滾動(dòng)寬度
obj.scrollHeight ==> 獲取對(duì)象的滾動(dòng)高度
obj.scrollLeft ==> 設(shè)置或獲取位于對(duì)象左端滾動(dòng)的距離
obj.scrollTop ==> 設(shè)置或獲取位于對(duì)象頂端滾動(dòng)的距離
Jq 獲取對(duì)象的相對(duì)高度和寬度
obj.offset().left ==> 元素相對(duì)于文檔的left
obj.offset().top ==> 元素相對(duì)于文檔的top
obj.scrollLeft() ==> 設(shè)置或返回對(duì)象相對(duì)滾動(dòng)條左側(cè)的偏移。
obj.scrollTop() ==> 設(shè)置或返回對(duì)象相對(duì)滾動(dòng)條頂部的偏移。
以上所述是小編給大家介紹的Js與Jq獲取瀏覽器和對(duì)象值的方法,希望對(duì)大家有所幫助!
- 淺談JavaScript的內(nèi)置對(duì)象和瀏覽器對(duì)象
- JavaScript瀏覽器對(duì)象之一Window對(duì)象詳解
- 淺談JavaScript 瀏覽器對(duì)象
- 微信瀏覽器內(nèi)置JavaScript對(duì)象WeixinJSBridge使用實(shí)例
- JavaScript Window瀏覽器對(duì)象模型方法與屬性匯總
- JavaScript 瀏覽器對(duì)象模型BOM使用介紹
- javascript history對(duì)象(歷史記錄)使用方法(實(shí)現(xiàn)瀏覽器前進(jìn)后退)
- JavaScript Window瀏覽器對(duì)象模型原理解析
相關(guān)文章
JavaScript與Div對(duì)層定位和移動(dòng)獲得坐標(biāo)的實(shí)現(xiàn)代碼
JavaScript與Div對(duì)層定位和移動(dòng)獲得坐標(biāo)的實(shí)現(xiàn)代碼,需要的朋友可以參考下。2010-09-09JavaScript實(shí)現(xiàn)一個(gè)多少秒后自動(dòng)跳轉(zhuǎn)的頁(yè)面(案例代碼)
最近遇到這樣一個(gè)需求是用js簡(jiǎn)單實(shí)現(xiàn)一個(gè)多少秒后自動(dòng)跳轉(zhuǎn)的頁(yè)面,實(shí)現(xiàn)代碼非常簡(jiǎn)單,對(duì)js自動(dòng)跳轉(zhuǎn)頁(yè)面相關(guān)知識(shí)感興趣的朋友一起看看吧2023-01-01js實(shí)現(xiàn)獲取兩個(gè)日期之間所有日期的方法
這篇文章主要介紹了js實(shí)現(xiàn)獲取兩個(gè)日期之間所有日期的方法,涉及javascript針對(duì)日期與時(shí)間的相關(guān)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06一個(gè)js封裝的不錯(cuò)的選項(xiàng)卡效果代碼
在論壇里經(jīng)常看到人問(wèn)選項(xiàng)卡或者類似選項(xiàng)卡的切換效果 這里封裝了個(gè)js,希望對(duì)大家有用 所有代碼都在下面了 如果有錯(cuò)誤或者建議,可以回貼告訴我,謝謝2008-02-02解決AJAX中跨域訪問(wèn)出現(xiàn)''沒(méi)有權(quán)限''的錯(cuò)誤
很多人在使用AJAX調(diào)用別人站點(diǎn)內(nèi)容的時(shí)候,JS會(huì)提示"沒(méi)有權(quán)限"錯(cuò)誤,這是XMLHTTP組件的限制-安全起見(jiàn)2008-08-08利用javascript移動(dòng)div層-javascript 拖動(dòng)層
利用javascript開(kāi)發(fā)在界面上隨意拖動(dòng)以下html code中的div層2009-03-03微信小程序?qū)崿F(xiàn)watch監(jiān)聽(tīng)
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)watch監(jiān)聽(tīng),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06使用不同的方法結(jié)合/合并兩個(gè)JS數(shù)組
這是一篇關(guān)于JavaScript數(shù)組使用的一些技巧,我們將使用不同的方法結(jié)合/合并兩個(gè)JS數(shù)組,以及討論每個(gè)方法的優(yōu)點(diǎn)/缺點(diǎn)2014-09-09(轉(zhuǎn)載)JavaScript中匿名函數(shù),函數(shù)直接量和閉包
(轉(zhuǎn)載)JavaScript中匿名函數(shù),函數(shù)直接量和閉包...2007-05-05