HTML DOM clientWidth Eigenschaft

HTML DOM Element-Objekt

clientWidthSchreibgeschützte Eigenschaft, die die sichtbare Breite des Elements in Pixeln zurückgibt, einschließlich Füllung, aber ohne Rahmen, Seitenabstand und vertikale Scrollleiste (wenn vorhanden).

Die Berechnungsformel für clientWidth lautet: CSS Breite + CSS Ausfüllung-die Breite der vertikalen Scrollleiste (wenn vorhanden) kennen.

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

VerwendungoffsetWidthDiese Eigenschaft kann die sichtbare Breite des Elements zurückgeben, einschließlich Füllung, Rahmen und vertikaler Scrollleiste.

Syntax:

element.clientWidth

var elem = document.querySelector("div");
var txt = "Hohe Einbettung beinhaltet: "　+　elem.clientHeight　+　"px<br>";
txt　+=　"Breite einschließlich Füllung:　"　+　elem.clientWidth　+　"px";

Browserkompatibilität

clientWidth-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 = "Breite einschließlich Füllung:　"　+　elem.clientWidth　+　"px<br>";
txt　+=　"Breite einschließlich Füllung+Rahmen:　"　+　elem.offsetWidth　+　"px";

Verwandte Referenzen

HTML DOM Referenz:HTML DOM offsetWidth-Eigenschaft

HTML DOM Referenz:HTML DOM scrollWidth-Eigenschaft

CSS Referenz:CSS overflow-Eigenschaft

HTML DOM Element-Objekt