javascript document.compatMode 호환성_javascript 팁

IE의 박스 모델 렌더링은 표준 모드와 Quirks 모드 사이에서 매우 다릅니다. 표준 모드의 박스 모델 해석은 다른 표준 브라우저의 해석과 동일하지만 Doctype을 선언하지 않은 IE에서는 큰 차이가 있습니다. 기본값은 Quirks 모드입니다. 따라서 호환성상의 이유로 현재 문서 렌더링 방법을 가져와야 할 수도 있습니다.

document.compatMode는 BackCompat과 CSS1Compat라는 두 가지 반환 값을 가지므로 유용합니다.

BackCompat: 표준 호환성 모드가 꺼졌습니다. 브라우저 클라이언트 영역의 너비는 document.body.clientWidth입니다. CSS1Compat: 표준 호환 모드가 켜져 있습니다. 브라우저 클라이언트 영역 너비는 document.documentElement.clientWidth입니다.

그런 다음 웹페이지 클라이언트 영역의 너비와 높이, 스크롤바의 너비와 높이, 스크롤바의 왼쪽과 위쪽을 정확하게 가져오는 코드를 작성했습니다.

코드 복사 코드는 다음과 같습니다.

if (document.compatMode == "BackCompat") {
cWidth = document.body.clientWidth;
cHeight = document.body.clientHeight;
sWidth = document.body.scrollHeight;
sLeft = 문서 .body.scrollLeft;
sTop = document.body.scrollTop;
}
else { //document.compatMode == "CSS1Compat"
cWidth = document.documentElement.clientWidth; = document.documentElement.clientHeight;
sWidth = document.documentElement.scrollWidth;
sHeight = document.documentElement.scrollLeft == 0 ? .documentElement.scrollLeft;
sTop = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;