成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JavaScript DOM位置尺寸API

moven_j / 2416人閱讀

摘要：我們需要了解幾個(gè)基礎(chǔ)概念，每個(gè)元素都有下列屬性為了理解這些屬性，我們需要知道元素的實(shí)際內(nèi)容有可能比分配用來容納內(nèi)容的盒子更大，因此可能會出現(xiàn)滾動條，內(nèi)容區(qū)域是視口，當(dāng)實(shí)際內(nèi)容比視口大的時(shí)候，需要把元素的滾動條位置考慮進(jìn)去。

我們需要了解幾個(gè)基礎(chǔ)概念，每個(gè)HTML元素都有下列屬性

offsetWidth      clientWidth     scrollWidth

offsetHeight     clientHeight    scrollHeight

offsetLeft       clientLeft      scrollLeft

offsetTop        clientTop       scrollTop

為了理解這些屬性，我們需要知道HTML元素的實(shí)際內(nèi)容有可能比分配用來容納內(nèi)容的盒子更大，因此可能會出現(xiàn)滾動條，內(nèi)容區(qū)域是視口，當(dāng)實(shí)際內(nèi)容比視口大的時(shí)候，需要把元素的滾動條位置考慮進(jìn)去。

clientHeight和clientWidth用于描述元素內(nèi)尺寸，是指 元素內(nèi)容+內(nèi)邊距 大小，不包括邊框（IE下實(shí)際包括）、外邊距、滾動條部分

offsetHeight和offsetWidth用于描述元素外尺寸，是指 元素內(nèi)容+內(nèi)邊距+邊框，不包括外邊距和滾動條部分

clientTop和clientLeft返回內(nèi)邊距的邊緣和邊框的外邊緣之間的水平和垂直距離，也就是左，上邊框?qū)挾?/p>

offsetTop和offsetLeft表示該元素的左上角（邊框外邊緣）與已定位的父容器（offsetParent對象）左上角的距離

offsetParent對象是指元素最近的定位（relative,absolute）祖先元素，遞歸上溯，如果沒有祖先元素是定位的話，會返回null

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/53207.html

相關(guān)文章

  • JavaScript DOM位置尺寸API

    摘要：我們需要了解幾個(gè)基礎(chǔ)概念，每個(gè)元素都有下列屬性為了理解這些屬性，我們需要知道元素的實(shí)際內(nèi)容有可能比分配用來容納內(nèi)容的盒子更大，因此可能會出現(xiàn)滾動條，內(nèi)容區(qū)域是視口，當(dāng)實(shí)際內(nèi)容比視口大的時(shí)候，需要把元素的滾動條位置考慮進(jìn)去。 我們需要了解幾個(gè)基礎(chǔ)概念，每個(gè)HTML元素都有下列屬性 offsetWidth clientWidth scrollWidth offsetHe...

    dinfer 評論0 收藏0

  • 高性能JavaScript閱讀簡記（二）

    摘要：訪問集合元素時(shí)使用局部變量對于任何類型的訪問，如果對同一個(gè)屬性或者方法訪問多次，最好使用一個(gè)局部變量對此成員進(jìn)行緩存。 三、DOM Scripting DOM編程 我們都知道對DOM操作的代價(jià)昂貴，這往往成為網(wǎng)頁應(yīng)用中的性能瓶頸。在解決這個(gè)問題之前，我們需要先知道什么是DOM，為什么他會很慢。 DOM in the Browser World 瀏覽器中的DOM DOM是一個(gè)獨(dú)立于語言...

    RaoMeng 評論0 收藏0

  • 高性能JavaScript閱讀簡記（二）

    摘要：訪問集合元素時(shí)使用局部變量對于任何類型的訪問，如果對同一個(gè)屬性或者方法訪問多次，最好使用一個(gè)局部變量對此成員進(jìn)行緩存。 三、DOM Scripting DOM編程 我們都知道對DOM操作的代價(jià)昂貴，這往往成為網(wǎng)頁應(yīng)用中的性能瓶頸。在解決這個(gè)問題之前，我們需要先知道什么是DOM，為什么他會很慢。 DOM in the Browser World 瀏覽器中的DOM DOM是一個(gè)獨(dú)立于語言...

    coolpail 評論0 收藏0

  • 你不知道的瀏覽器頁面渲染機(jī)制

    摘要：前言瀏覽器的內(nèi)核是指支持瀏覽器運(yùn)行的最核心的程序，分為兩個(gè)部分的，一是渲染引擎，另一個(gè)是引擎。渲染引擎在不同的瀏覽器中也不是都相同的。接下來就是瀏覽器的渲染過程。布局完成后，瀏覽器會立即發(fā)出和事件，將渲染樹轉(zhuǎn)換成屏幕上的像素。 前言 瀏覽器的內(nèi)核是指支持瀏覽器運(yùn)行的最核心的程序，分為兩個(gè)部分的，一是渲染引擎，另一個(gè)是JS引擎。渲染引擎在不同的瀏覽器中也不是都相同的。目前市面上常見的瀏覽...

    aboutU 評論0 收藏0

發(fā)表評論

0條評論

moven_j

男|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<