HTML DOM offsetWidth Eigenschaft

HTML DOM Element-Objekt

offsetWidthLesbare Eigenschaft, die die Breite des Elements in ganzzahliger Form zurückgibt, einschließlich horizontaler Paddings und Ränder.

normalerweise die Pixel-Messung der CSS-Breite des Elements einschließlich aller Ränder, Paddings und der vertikalen Scrollleiste (falls vorhanden). Sie schließt die Breite von Pseudo-Elementen nicht ein, wie z.B.:: beforeoder:: after.

Um diese Eigenschaft zu verstehen, müssen Sie dasCSS Box-Modell.

Verwendung:clientHeightundclientWidthDiese Eigenschaft gibt die sichtbare Breite und Höhe des Elements zurück, einschließlich des Paddings, aber ohne Rahmen, Abstand und (falls vorhanden) Scrollbalken.

Syntax:

element.offsetWidth

var elem = document.querySelector("div");
var txt = "Höhe einschließlich Paddings und Ränder: "　+　elem.offsetHeight　+　"px<br>";
txt　+"Breite einschließlich Paddings und Ränder: "　+　elem.offsetWidth　+　"px";

Browserkompatibilität

offsetWidth-Eigenschaft wird von allen Browsern vollständig unterstützt:

Technische Details

Mehr Beispiele

Dieser Beispiel zeigt die Unterschiede zwischen clientWidth und offsetWidth:

var elem = document.querySelector("div");
var txt = "Width enthält padding: "　+　elem.clientWidth　+　"px<br>";
txt　+= "Width enthält padding"　+　border: "　+　elem.offsetWidth　+　"px";

Verwandte Referenzen

HTML DOM-Referenz:offsetHeight-Eigenschaft

HTML DOM-Referenz:offsetLeft-Eigenschaft

HTML DOM-Referenz:offsetTop-Eigenschaft

HTML DOM-Referenz:offsetParent-Eigenschaft

HTML DOM Element-Objekt