document.copatMode 에 대해 많은 친구 들 이 저 처럼 접촉 이 적 을 수도 있 고 그의 존 재 를 알 면서 도 그의 용 도 를 잘 모 를 수도 있 습 니 다.사실 이것 은 우리 가 호환성 있 는 웹 페이지 를 개발 하 는 데 도움 이 된다 는 것 을 잘 알 고 있 습 니 다.상자 모델 의 렌 더 링 은 Standards Mode 와 Quirks Mode 에 큰 차이 가 있 습 니 다.Doctype 을 설명 하지 않 은 상황 에서 브 라 우 저 는 기본적으로 Quirks Mode 입 니 다.따라서 호환성 을 고려 하기 위해 서 는 현재 문서 렌 더 링 방식 을 가 져 와 야 할 수도 있 습 니 다.document.copatMode 가 마침 도움 이 되 었 습 니 다.BackCompat 와 CSS 1 Compat 는 두 가지 가능 한 반환 값 이 있 습 니 다.BackCompat Standards-compliant mode is not switched on.(Quirks Mode)CSS 1 Compat Standards-compliant mode is switched on.(Standards Mode)문서 에 표준 성명 이 있 을 때 document.copatMode 의 값 은"CSS 1 compat"와 같 습 니 다.따라서 우 리 는 document.copatMode 의 값 에 따라 문서 에 표준 성명 var height=document.copatMode=="CSS 1 Compat"를 추 가 했 는 지 판단 할 수 있 습 니 다.document.documentElement.clientHeight : document.body.clientHeight; 문서 에 표준 성명 이 있 을 때 화 호의 style.top 등 설정 은'px'등 단 위 를 추가 해 야 합 니 다.그렇지 않 으 면 알 아 보지 못 합 니 다.이미 이 야 기 를 했 으 니 다시 한번 펼 쳐 보 자.불 여우:1.offsetTop 은 숫자 를 되 돌려 주 고 style.top 은 문자열 을 되 돌려 주 며 숫자 외 에 단위:px 도 있 습 니 다.2.offsetTop 은 읽 기만 하고 style.top 은 읽 고 쓸 수 있 습 니 다.3.HTML 요소 에 top 스타일 을 지정 하지 않 았 다 면 style.top 은 빈 문자열 을 되 돌려 줍 니 다.offset Left 와 style.left,offset Width 와 style.width,offset Height 와 style.height 도 마찬가지다.그리고 그들의 차 이 를 말 해 보 세 요.아래 부분 은 모두 가 본 적 이 있 을 것 입 니 다.인터넷 에 여러 번 옮 겨 졌 습 니 다.여기 서도 저도 빌려 쓰 겠 습 니 다."Kfk 428{display:none;"웹 페이지 의 보 이 는 영역 너비:document.body.clientWidth;웹 페이지 의 보 이 는 영역 이 높 습 니 다:document.body.clientHeight;웹 페이지 의 보 이 는 영역 너비:document.body.of set Width(사 이 드 라인 의 너비 포함);웹 페이지 의 보 이 는 영역 이 높 습 니 다:document.body.of set Height(사 이 드 라인 의 너비 포함);웹 페이지 본문 전문 너비:document.body.scrollWidth;웹 페이지 본문 전문 높이:document.body.scrollHeight;웹 페이지 가 말 려 있 는 높이:document.body.scrollTop;웹 페이지 가 말 린 왼쪽:document.body.scrollLeft;웹 페이지 본문 부분:window.screenTop;웹 페이지 본문 부분 왼쪽:window.screenLeft;화면 해상도 높 음:window.screen.height;화면 해상도 너비:window.screen.width;화면 사용 가능 한 작업 영역 높이:window.screen.availHeight;화면 사용 가능 한 작업 영역 너비:window.screen.availWidth;
scroll Height:대상 의 스크롤 높이 를 가 져 옵 니 다.scrollLeft:대상 의 왼쪽 경계 와 창 에서 현재 보 이 는 내용 의 가장 왼쪽 끝 사이 의 거 리 를 설정 하거나 가 져 옵 니 다 scrollTop:대상 의 맨 위 와 창 에서 보 이 는 내용 의 맨 위 사이 의 거 리 를 설정 하거나 가 져 옵 니 다 scrollWidth:대상 의 스크롤 폭 offset Height:대상 이 지면 이나 부모 좌표 offset Parent 속성 에 따라 지정 한 부모 좌표 의 높이 off 를 가 져 옵 니 다.setLeft:대상 이 지면 이나 offsetParent 속성 에 따라 지정 한 부모 좌 표를 가 져 오 는 계산 왼쪽 위치 offsetTop:대상 이 지면 이나 offsetTop 속성 에 따라 지정 한 부모 좌 표를 가 져 오 는 계산 상단 위치 event.clientX 상대 문서 의 수평 좌표 event.clientY 상대 문서 의 수직 좌표 event.offsetX 상대 용기 의 수평 좌표 event.offsetY 상대용기 의 수직 좌표 document.documentElement.scrollTop 수직 방향 으로 굴 러 가 는 값 event.clientX+document.documentElement.scrollTop 상대 문서 의 수평 좌표+수직 방향 으로 굴 러 가 는 양 이상 은 주로 IE 를 말 합 니 다.FireFox 의 차 이 는 다음 과 같 습 니 다.IE 6.0,FF 1.06+:clientWidth=width+padding clientHeight=height+padding offsetWidth=width+padding+border offsetHeight=height+padding+border IE 5.0/5.5:clientWidth=width-border clientHeight=height-border offsetWidth=width offsetHeight=height(CSS 의 margin 속성,clientWidth,offsetWidth,client Height,offset Height 모두 무관)문서 형식 을 설정 한 후에 도 차이 가 있 을 수 있 으 므 로 참고 하 시기 바 랍 니 다.
