Atrybut clientHeight elementu HTML DOM

Definicja i zastosowanie

clientHeight Atrybut zwraca widoczną wysokość elementu, w tym wewnętrzne marginesy, ale bez ramki, paska przewijania lub marginesów zewnętrznych, w pikselach.

clientHeight Atrybut jest tylko do odczytu.

Zobacz również:Tutorial CSS Box Model

Zobacz również:

przykład clientWidth

przykład clientTop

przykład clientLeft

przykład offsetHeight

przykład offsetWidth

Aby dodać elementowi paskę przewijania, użyj Atrybut overflow CSS.

Przykład

Przykład 1

Uzyskaj wysokość i szerokość "myDIV", w tym wewnętrzne marginesy:

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

Spróbuj sam

Przykład 2: różnica między clientHeight/clientWidth a offsetHeight/offsetWidth

Bez ro滚条：

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

Spróbuj sam

Z ro滚条：

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

Spróbuj sam

Gramatyka

element.clientHeight

Zwracana wartość

Typ Opis
Numer Widoczna wysokość elementu (w pikselach), w tym wewnętrzne marginesy.

Wspieranie przeglądarek

Wszystkie przeglądarki wspierają element.clientHeight:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Wspierane Wspierane Wspierane Wspierane Wspierane Wspierane