Хусусияти clientHeight

Хусусияти clientHeight баландиии элементро дар дохили сарҳадҳо якҷоя бо padding дар бар мегирад, вале бе border ва гардиш.

Синтаксис

javascriptэлемент.clientHeight;

Намуна

Биёед андозаи элементро пайдо кунем:

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

Натиҷаи иҷрои рамз:

javascript130

Намуна

Агар барои элемент гардиш пайдо шавад, паҳноии мундариҷа бошад ба паҳноии гардиш кам мешавад (тақрибан 16px - аз браузер, системаи амалӣ, дастгоҳ вобаста аст). Дар намунаи оянда паҳноии элемент камтар хоҳад буд, аз он чи интизор меравад:

html<div id="elem">Ин элемент гардиш дорад.</div>
css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  padding: 15px;
  overflow: scroll;
}
javascriptlet elem = document.querySelector('#elem');
console.log(elem.clientHeight);

Натиҷаи иҷрои рамз:

javascript114 (аз браузер вобаста аст)

Намуна

Агар элемент пинҳон бошад, пас clientHeight баробар хоҳад буд ба 0:

html<div id="elem"></div>
css#elem {
  width: 100px;
  height: 100px;
  border: 1px solid black;
  display: none; /* элементи пинҳонӣ */
}
javascriptlet elem = document.querySelector('#elem');
console.log(elem.clientHeight);

Натиҷаи иҷрои рамз:

javascript0

Нигаред низ

  • хусусияти clientWidth,
    ки паҳноии элементро дар дохили сарҳадҳо дар бар мегирад
  • методи getComputedStyle,
    ки қимати хусусияти CSS-и элементро мегирад