ගුණය 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 ගුණයේ අගය ලබා ගනී
