Właściwość offsetWidth

Właściwość offsetWidth zawiera pełną szerokość elementu (zawiera właściwą szerokość elementu, szerokość obramowań, wewnętrzne odstępy, paski przewijania):

Składnia

element.offsetWidth;

Przykład

Sprawdźmy pełny rozmiar elementu:

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

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

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

Wynik wykonania kodu:

150

Przykład

Jeśli element jest ukryty, to offsetWidth wynosi 0:

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

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

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

Wynik wykonania kodu:

0

Zobacz też

właściwość clientWidth,
która zawiera szerokość elementu wewnątrz obramowań
właściwość offsetHeight,
która zawiera pełną wysokość elementu
metoda getComputedStyle,
która uzyskuje wartość właściwości CSS elementu