HTML DOM Element clientWidth-egenskapen

Definition och användning

clientWidth Egenskapen returnerar elementets synliga bredd, inklusive inre marginaler, men inte ram, rullgardin eller marginaler, i pixlar.

clientWidth Egenskapen är skrivskyddad.

Se också:CSS rammodell教程

Se också:

clientHeight-attribut

clientTop-attribut

clientLeft-attribut

offsetHeight-attribut

offsetWidth-attribut

För att lägga till en rullgardin till ett element, använd CSS overflow egenskap

Exempel

Exempel 1

Hämta höjden och bredden av "myDIV", inklusive inre marginaler:

const element = document.getElementById("myDIV");
let text = "clientHeight: " + element.clientHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px";

Prova själv

Exempel 2

Exempel 2: skillnaden mellan clientHeight/clientWidth och offsetHeight/offsetWidth

Utan rullgardin:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

Prova själv

Med rullgardin:

const element = document.getElementById("myDIV");
let text = "";
text += "clientHeight: " + element.clientHeight + "px<br>";
text += "offsetHeight: " + element.offsetHeight + "px<br>";
text += "clientWidth: " + element.clientWidth + "px<br>";
text += "offsetWidth: " + element.offsetWidth + "px";

Prova själv

Syntaks

element.clientWidth

Returvärde

Typ Beskrivning
Numer Elementets synliga bredd (i pixlar), inklusive inre marginaler.

Webbläsarstöd

Alla webbläsare stöder element.clientWidth

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Stödjer Stödjer Stödjer Stödjer Stödjer Stödjer