innerHeight 메소드는 안쪽 높이를 알아냅니다. (height + padding 값)

https://superkts.com/jquery/innerHeight

jQuery 공작소 : .innerHeight()

height : 100px 인 DIV 의 높이 알아보기
padding 위아래 20px, 테두리두께 위아래 각 5px
실제 DIV 의 높이는 150px 입니다.

innerHeight 보기 height 보기(비교용)

이 예제의 innerHeight 는 height 100px + 위쪽 padding 20px + 아래쪽 padding 20px = 140px 입니다.

소스

<style type="text/css">
    .css_test {
        background : #efefef;
        border : 5px solid gray;
        margin : 0 auto; /* DIV 가운데로 정렬 */
        padding : 20px;
        width : 400px;
        height : 100px;
    }
</style>

height : 100px 인 DIV 의 높이 알아보기<br>
padding 위아래 20px, 테두리두께 위아래 각 5px<br>
실제 DIV 의 높이는 150px 입니다.<br>
<div class="css_test">
    <br><br>
    <button type="button" onclick="alert($('.css_test').innerHeight())">innerHeight 보기</button> <button type="button" onclick="alert($('.css_test').height())">height 보기(비교용)</button><br>
    <br><br>
</div>
<br>
이 예제의 innerHeight 는 height 100px + 위쪽 padding 20px + 아래쪽 padding 20px = 140px 입니다.

height : 100px 인 DIV 의 높이 알아보기<br>
padding 위아래 20px, 테두리두께 위아래 각 5px<br>
실제 DIV 의 높이는 150px 입니다.<br>
<div class="css_test">
    <br><br>
    <button type="button" onclick="alert($('.css_test').innerHeight())">innerHeight 보기</button> <button type="button" onclick="alert($('.css_test').height())">height 보기(비교용)</button><br>
    <br><br>
</div>
<br>
이 예제의 innerHeight 는 height 100px + 위쪽 padding 20px + 아래쪽 padding 20px = 140px 입니다.

 

jQuery

$( 셀렉터 ).innerHeight()  -  셀렉터에 해당하는 요소의 안쪽 높이를 알아냅니다.

- 지정된 height 와 padding 의 값을 포함합니다.
- margin 과 border 두께값은 포함하지 않습니다.