jQuery_jquery에서 height innerHeight externalHeight 간의 차이에 대한 소개 예
- WBOY원래의
- 2016-05-16 16:44:28925검색
표준 브라우저에서:
높이: 높이
innerHeight: 높이 + 패딩
outerHeight: 높이 + 패딩 + 테두리, 매개변수가 true인 경우: 높이 + 패딩 + 테두리 + 여백
html 코드:
코드 복사 코드는 다음과 같습니다.
< div 클래스 ="너비: 150px; 높이: 20px; 부동: 왼쪽; 테두리: 2px 단색 빨간색; 여백: 10px; 여백: 10px; 패딩: 10px;" id="test">jjjjj
코드 복사 코드는 다음과 같습니다.
Alert($(" #test").height());
alert($("#test").innerHeight())
alert($("#test").outerHeight()) ;
alert ($("#test").outerHeight(true));
결과: alert($("#test").innerHeight())
alert($("#test").outerHeight()) ;
alert ($("#test").outerHeight(true));
결과: 17px, 37px, 41px, 61px
ff : 20px, 40px, 44px, 64px
html 코드:
코드 복사 코드는 다음과 같습니다.
jjjjj< ;/div>
js 코드: 코드 복사 코드는 다음과 같습니다. 다음:
alert($("#test").height())
alert($("#test").innerHeight()); ("#test").outerHeight());
alert($("#test").outerHeight(true))
[html]
결과: 17px , 37px, 41px, 61px
결과는 ff: 41px, 61px, 65px, 85px
html 코드:
[code]
js 코드:
alert($("#test").innerHeight()); ("#test").outerHeight());
alert($("#test").outerHeight(true))
[html]
결과: 17px , 37px, 41px, 61px
결과는 ff: 41px, 61px, 65px, 85px
html 코드:
[code]
jjjjj
js 코드:
코드 복사 코드는 다음과 같습니다. alert($("#test"). height());
alert($("#test").innerHeight()) alert($("#test").outerHeight()); test").outerHeight( true));
결과:
결과: ie: 18px, 38px, 42px, 62px
결과: ff: 42px, 62px, 66px, 86px
결과:
결과: ie: 18px, 38px, 42px, 62px
결과: ff: 42px, 62px, 66px, 86px
html 코드:
코드 복사
코드는 다음과 같습니다. < ;div class=" 너비: 150px; 높이: 60px; float: 왼쪽; 테두리: 2px 단색 빨간색; 여백: 10px; 패딩: 10px;" id="test">jjjjj
> 코드 복사
코드는 다음과 같습니다. alert($("#test").height()); alert($("#test").innerHeight()) alert($("#test").outerHeight() );
alert($ ("#test").outerHeight(true)); 결과:
결과: 36px, 56px, 60px, 80px
in ff: 60px , 80px, 84px, 104px
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.