Хусусияти clientHeight

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

Синтаксис

элемент.clientHeight;

Намуна

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

#elem {
	width: 100px;
	height: 100px;
	border: 1px solid black;
	padding: 15px;
}

<div id="elem"></div>

let elem = document.querySelector('#elem');
console.log(elem.clientHeight);

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

130

Намуна

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

<div id="elem">Ин элемент гардиш дорад.</div>

#elem {
	width: 100px;
	height: 100px;
	border: 1px solid black;
	padding: 15px;
	overflow: scroll;
}

let elem = document.querySelector('#elem');
console.log(elem.clientHeight);

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

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

Намуна

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

<div id="elem"></div>

#elem {
	width: 100px;
	height: 100px;
	border: 1px solid black;
	display: none; /* элементи пинҳонӣ */
}

let elem = document.querySelector('#elem');
console.log(elem.clientHeight);

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

0

Нигаред низ

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