Eýeçilik clientHeight

Eýeçilik clientHeight element belgisini çäkler içinde padding bilen bilelikde, ýöne border we süýşmeksiz saklaýar.

Sintaksis

javascriptelement.clientHeight;

Mysal

Geliň element ölçegini tapalyň:

css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  padding: 15px;
}
html<div id="elem"></div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.clientHeight);

Kodyň ýerine ýetiriliş netijesi:

javascript130

Mysal

Eger elementde süýşme ýüze çyksa, onda mazmun belgisi süýşme belgisi boýunça azalýar (takmynan 16px - brauzere, Operasion Sistemä, enjama bagly). Indiki mysalda element belgisi garaşylýandan kiçi bolar:

html<div id="elem">Bu elementde süýşme bar.</div>
css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  padding: 15px;
  overflow: scroll;
}
javascriptlet elem = document.querySelector('#elem');
console.log(elem.clientHeight);

Kodyň ýerine ýetiriliş netijesi:

javascript114 (brauzere bagly)

Mysal

Eger element gizlenen bolsa, onda clientHeight 0 deň bolar:

html<div id="elem"></div>
css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  display: none; /* gizlenen element */
}
javascriptlet elem = document.querySelector('#elem');
console.log(elem.clientHeight);

Kodyň ýerine ýetiriliş netijesi:

javascript0

Hem-de garaň

  • eýeçilik clientWidth,
    element belgisini çäkler içinde saklaýar
  • usul getComputedStyle,
    elementiň CSS eýeçilik bahasyny alyş üçin