HTML DOM Element clientWidth ominaisuus

Määrittely ja käyttö

clientWidth ominaisuus palauttaa elementin näkyvän leveyden, mukaan lukien sisätilat, mutta ei reunaviivoja, pyyhkäisynauhaa tai ulkoreunaa, pikseleinä.

clientWidth Ominaisuus on lukuinen.

Katso myös:CSS-ruudukkomallin opetus

Katso myös:

clientHeight-ominaisuus

clientTop-ominaisuus

clientLeft-ominaisuus

offsetHeight-ominaisuus

offsetWidth-ominaisuus

Jos haluat lisätä pyyhkäisynauhan elementtiin, käytä CSS overflow ominaisuus

esimerkki

Esimerkki 1

Hanki "myDIV" korkeus ja leveys, mukaan lukien sisätilat:

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

kokeile itse

Esimerkki 2

Esimerkki 2: clientHeight/clientWidth ja offsetHeight/offsetWidth ero

Ei pyyhkäisynauhaa:

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";

kokeile itse

Onko pyyhkäisynauha:

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";

kokeile itse

syntaksi

element.clientWidth

palautusarvo

tyyppi kuvaus
arvo Elementin näkyvä leveys (pikseleinä), mukaan lukien sisätilat.

selaimen tuki

Kaikki selaimet tukevat element.clientWidth

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
tuki tuki tuki tuki tuki tuki