Proprietà offsetWidth

La proprietà offsetWidth contiene la larghezza completa dell'elemento (include la larghezza dell'elemento stesso, la larghezza dei bordi, il padding interno, le barre di scorrimento):

Sintassi

elemento.offsetWidth;

Esempio

Scopriamo le dimensioni complete di un elemento:

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

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

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

Risultato dell'esecuzione del codice:

150

Esempio

Se l'elemento è nascosto, offsetWidth è 0:

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

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

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

Risultato dell'esecuzione del codice:

0

Vedi anche

proprietà clientWidth,
che contiene la larghezza dell'elemento all'interno dei bordi
proprietà offsetHeight,
che contiene l'altezza completa dell'elemento
metodo getComputedStyle,
che ottiene il valore della proprietà CSS di un elemento