HTML DOM scrollWidth 屬性

元素對象參考手冊 元素對象

實例

獲取 div 元素的高度和寬度,包含內邊距(padding):

var elmnt = document.getElementById("content"); var y = elmnt.scrollHeight; var x = elmnt.scrollWidth;

嚐試一下 »

定義和用法

scrollWidth 屬性是一個隻讀屬性,它返回該元素的像素寬度,高度包含內邊距(padding),不包含外邊距(margin)、邊框(border),是一個整數,單位是像素 px。

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

這是一個隻讀屬性。


瀏覽器支持

屬性
scrollWidth Yes Yes Yes Yes Yes

語法

element.scrollWidth 

技術細節

返回值: 返回一個整數,表示該元素的像素寬度。

更多實例

實例

使用 padding(內邊距), border(邊框), scrollbar(滾動條) 以及 margin(外邊距)來演示 scrollWidth 和 scrollHeight 屬性的變化:

var elmnt = document.getElementById("content"); var y = elmnt.scrollHeight; var x = elmnt.scrollWidth;

嚐試一下 »

實例

返回元素 scrollHeight 和 scrollWidth 屬性的值,然後將獲取的高度和寬度來設置另外一個元素的 scrollHeight 和 scrollWidth 屬性值:

var elmnt = document.getElementById("content"); function getFunction() { var x = elmnt.scrollWidth; var y = elmnt.scrollHeight; } function setFunction() { elmnt.style.height = y.scrollHeight + "px"; elmnt.style.width = y.scrollWidth + "px"; }

嚐試一下 »


元素對象參考手冊 元素對象