Egenskapen offsetWidth

Egenskapen offsetWidth innehåller hela bredden på ett element (inkluderar elementets faktiska bredd, kantlinjers bredd, inre utfyllnad, rullningslister):

Syntax

element.offsetWidth;

Exempel

Låt oss ta reda på elementets totala storlek:

<div id="elem"></div>

#elem {
	width: 100px;
	height: 100px;
	padding: 15px;
	border: 10px solid black;
}

let elem = document.querySelector('#elem');
console.log(elem.offsetWidth);

Resultat av kodkörning:

150

Exempel

Om elementet är dolt, så är offsetWidth 0:

<div id="elem"></div>

#elem {
	display: none; /* dolt element */
	width: 100px;
	height: 100px;
	padding: 15px;
	border: 10px solid black;
}

let elem = document.querySelector('#elem');
console.log(elem.offsetWidth);

Resultat av kodkörning:

0

Se även

egenskapen clientWidth,
som innehåller bredden på elementet innanför kantlinjerna
egenskapen offsetHeight,
som innehåller hela höjden på elementet
metoden getComputedStyle,
som hämtar värdet på ett CSS-egenskap för ett element