Element的各種寬高度

2021-09-02 22:22:52 字數 2374 閱讀 8033

屬性

含義clientwidth

表示元素的內部寬度,以畫素計。該屬性包括內邊距,但不包括垂直滾動條(如果有)、邊框和外邊距

clientheight

唯讀屬性,對於沒有定義css或者內聯布局盒子的元素為0,否則,它是元素內部的高度(單位畫素),包含內邊距,但不包括水平滾動條、邊框和外邊距

clienttop

乙個元素頂部邊框的寬度(以畫素表示)。不包括頂部外邊距或內邊距。clienttop 是唯讀的。

clientleft

表示乙個元素的左邊框的寬度,以畫素表示。如果元素的文字方向是從右向左(rtl, right-to-left),並且由於內容溢位導致左邊出現了乙個垂直滾動條,則該屬性包括滾動條的寬度。clientleft不包括左外邊距和左內邊距

屬性含義

offsetparent

返回乙個指向最近的(closest,指包含層級上的最近)包含該元素的定位元素。如果沒有定位的元素,則 offsetparent 為最近的 table, table cell 或根元素(標準模式下為 html;quirks 模式下為 body)。當元素的 style.display 設定為 「none」 時,offsetparent 返回 null。offsetparent 很有用,因為 offsettop 和 offsetleft 都是相對於其內邊距邊界的。

offsettop

它返回當前元素相對於其 offsetparent 元素的頂部的距離。

offsetleft

返回當前元素左上角相對於 offsetparent 節點的左邊界偏移的畫素值。

offsetwidth

唯讀屬性,返回乙個元素的布局寬度。乙個典型的offsetwidth是測量包含元素的邊框(border)、水平線上的內邊距(padding)、豎直方向滾動條(scrollbar)(如果存在的話)、以及css設定的寬度(width)的值

offsetheight

唯讀屬性,它返回該元素的畫素高度,高度包含該元素的垂直內邊距和邊框,且是乙個整數。通常,元素的offsetheight是一種元素css高度的衡量標準,包括元素的邊框、內邊距和元素的水平滾動條(如果存在且渲染的話),不包含:before或:after等偽類元素的高度

屬性含義

scrolltop

scrolltop 屬性可以獲取或設定乙個元素的內容垂直滾動的畫素數。乙個元素的 scrolltop 值是這個元素的頂部到它的最頂部可見內容(的頂部)的距離的度量。當乙個元素的內容沒有產生垂直方向的滾動條,那麼它的 scrolltop 值為0。

scrollleft

scrollleft 屬性可以讀取或設定元素滾動條到元素左邊的距離。注意如果這個元素的內容排列方向(direction) 是rtl (right-to-left) ,那麼滾動條會位於最右側(內容開始處),並且scrollleft值為0。此時,當你從右到左拖動滾動條時,scrollleft會從0變為負數(這個特性在chrome瀏覽器中不存在)。

scrollwidth

唯讀屬性,表示元素內容的寬度,包括由於滾動而未顯示在螢幕中內容.scrollwidth值等於元素在不使用水平滾動條的情況下適合視口中的所有內容所需的最小寬度。 寬度的測量方式與clientwidth相同:它包含元素的內邊距,但不包括邊框,外邊距或垂直滾動條(如果存在)。 它還可以包括偽元素的寬度,例如::before或::after。 如果元素的內容可以適合而不需要水平滾動條,則其scrollwidth等於clientwidth

scrollheight

唯讀屬性是乙個元素內容高度的度量,**包括由於溢位導致的檢視中不可見內容。**scrollheight 的值等於該元素在不使用滾動條的情況下為了適應視口中所用內容所需的最小高度。 沒有垂直滾動條的情況下,scrollheight值與元素檢視填充所有內容所需要的最小值clientheight相同。包括元素的padding,但不包括元素的border和marginscrollheight也包括 ::before 和 ::after這樣的偽元素。

獲取view寬高度 獲取自定義元件寬高度

給view設定乙個id class 名,用法和jquery類似,用來獲取指定id相關資訊。test 測試view 把方法寫在onready,是為了再頁面初次渲染完成後,再去獲取,避免不準確或獲取不到的情況。onready function e exec 輸出結果 獲取自定義元件的相關資訊,與獲取vi...

jquery獲取各種高度

alert window height 瀏覽器時下視窗可視區域高度 alert document height 瀏覽器時下視窗文件的高度 alert document.body height 瀏覽器時下視窗文件body的高度 alert document.body outerheight true ...

js各種寬高的總結

1.clientwidth和clientheight 指元素的可視部分寬度和高度,就是padding content 如果沒有滾動條,就是設定的寬度和高度 如果有滾動條,就是設定的寬度和高度減去滾動條的寬度和高度 body document.body.clientwidth 500 80 580 d...