HTML DOM Element clientHeight అంశం

నిర్వచనం మరియు వినియోగం

clientHeight అంశం ఎలిమెంట్ యొక్క కనిపించే పొడవును తిరిగి వచ్చేది, అంతర్గత గడ్డకట్టు లు సహా, కానీ కాంతిరేఖలు, స్క్రోల్ బార్లు లేదా బయటప్పు గడ్డకట్టు లను చేర్చబడలేదు, పిక్సెల్స్ లో అంచనా వేయబడింది.

clientHeight అంశం మాత్రమే రద్దు చేయబడింది.

మరింత చూడండి:CSS ఫ్రేమ్ వర్క్ శిక్షణ పాఠ్యం

మరింత చూడండి:

clientWidth అంశం

clientTop అంశం

clientLeft అంశం

offsetHeight అంశం

offsetWidth అంశం

ఎలిమెంట్ కు స్క్రోల్ బార్ జోడించడానికి ఉపయోగించండి: 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:

క్రోమ్ ఐఇ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపెరా
క్రోమ్ ఐఇ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఒపెరా
మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు మద్దతు