ویژگی clientHeight عنصر HTML DOM

تعریف و استفاده

clientHeight ویژگی به ارتفاع قابل مشاهده عنصر، شامل فضای بین‌بندی، اما بدون لبه، اسکرول یا حاشیه بیرونی، با واحد پیکسل، بازمی‌گردد.

clientHeight ویژگی‌ها فقط خواندنی هستند.

لطفاً ببینید:آموزش مدل فریم CSS

لطفاً ببینید:

ویژگی clientWidth

ویژگی clientTop

ویژگی clientLeft

ویژگی offsetHeight

ویژگی offsetWidth

برای افزودن اسکرول به عنصر، از خصوصیت overflow CSS。

مثال

مثال 1

ارتفاع و عرض "myDIV" را به همراه فضای بین‌بندی دریافت کنید:

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

آزمایش کنید

مثال 2: تفاوت clientHeight/clientWidth و offsetHeight/offsetWidth

بدون اسکرول:

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

آزمایش کنید

با اسکرول:

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

آزمایش کنید

نحوه استفاده

element.clientHeight

مقدار بازگشتی

نوع توضیح
عدد ارتفاع قابل مشاهده عنصر (با واحد پیکسل)، شامل فضای بین‌بندی.

پشتیبانی مرورگر

همه مرورگرها از آن پشتیبانی می‌کنند element.clientHeight：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی