Propiedad clientHeight del DOM HTML

Objeto Elemento DOM HTML

clientHeightPropiedad de solo lectura que devuelve la altura visible del elemento (en píxeles), incluyendo el relleno, pero no el borde, el margen y la barra de desplazamiento horizontal (si existe).

Se puede calcular clientHeight como: Altura CSS+ Relleno CSS-la altura de la barra de desplazamiento horizontal (si existe).

Para entender esta propiedad, debes entenderModelo de caja CSS.

Se utilizaoffsetHeightLa propiedad devuelve la altura visible del elemento, incluyendo el relleno, el borde y la barra de desplazamiento horizontal.

Sintaxis:

element.clientHeight

var elem = document.querySelector("div");
var txt = "Altura que incluye relleno: "　+　elem.clientHeight　+　"px<br>";
txt　+= "Ancho que incluye relleno: "　+　elem.clientWidth　+　"px";

Compatibilidad del navegador

Todos los navegadores soportan completamente el atributo clientHeight:

Detalles técnicos

Más ejemplos

Este ejemplo muestra la diferencia entre clientHeight y offsetHeight:

var elem = document.querySelector("div");
var txt = "Alto　+　padding: "　+　elem.clientHeight　+　"px<br>";
txt　+="Alto　+　padding　+　border: "　+　elem.offsetHeight　+　"px";

Referencias relacionadas

Referencia DOM HTML:Atributo offsetHeight DOM HTML

Referencia DOM HTML:Atributo scrollHeight DOM HTML

Referencia de CSS:Atributo overflow de CSS

Objeto Elemento DOM HTML