HTML DOM clientHeight 속성

HTML DOM Element 객체

clientHeight읽기 전용 속성은 요소의 보이는 높이(픽셀 단위)를 반환하며, 채우기를 포함하지만 경계선, 페이지 마진 및 수평 스크롤 바(존재하면)를 제외합니다.

clientHeight는 다음과 같이 계산할 수 있습니다: CSS 높이+ CSS 채우기-수평 스크롤 바의 높이(존재하면).

이 속성을 이해하기 위해, 당신은 이해해야 합니다:CSS 박스 모델.

사용offsetHeight이 속성은 요소의 보이는 높이를 반환하며, 채우기, 경계선, 수평 스크롤 바를 포함합니다.

문법:

element.clientHeight

var　elem　=　document.querySelector("div");
var txt = "가득 차린 높이: "　+　elem.clientHeight　+　"px<br>";
txt　+= "가득 차린 너비: "　+　elem.clientWidth　+　"px";

브라우저 호환성

모든 브라우저는 clientHeight 속성을 완전히 지원합니다:

기술 세부 사항

更多示例

이 예제는 clientHeight와 offsetHeight 사이의 차이를 보여줍니다:

var　elem　=　document.querySelector("div");
var　txt　=　"Height　+　padding:　"　+　elem.clientHeight　+　"px<br>";
txt　+=　"Height　+　padding　+　border:　"　+　elem.offsetHeight　+　"px";

관련 참조

HTML DOM 참조:HTML DOM offsetHeight 속성

HTML DOM 참조:HTML DOM scrollHeight 속성

CSS 참조:CSS overflow 속성

HTML DOM Element 객체