1: 도구 모음 및 스크롤 막대를 제외한 웹 페이지의 표시 영역의 너비 및 높이(브라우저 창의 표시 영역 크기)
1. IE9+, chrome, firefox, Opera, Safari의 경우:
window.innerHeight 브라우저 창의 내부 높이입니다. window.innerWidth 브라우저 창의 내부 너비입니다.
2. IE8.7.6.5의 경우:document.documentElement.clientHeight: HTML 문서가 있는 창의 현재 높이를 나타냅니다.
document.documentElement.clientWidth: HTML 문서가 있는 창의 현재 너비를 나타냅니다.
문서 개체의 body 속성은 HTML 문서의
태그에 해당하며 다음과 같이 표현할 수도 있습니다.document.body.clientHeight: HTML 문서가 있는 창의 현재 높이를 나타냅니다.
document.body.clientWidth: HTML 문서가 있는 창의 현재 너비를 나타냅니다.
결론: document.body.clientWidth/Height: 너비와 높이가 너무 작고 높이는 기본적으로 200입니다.
document.documentElement.clientWidth/Height 및 창 .innerWidth의 너비와 높이. /높이는 항상 동일합니다.
그래서 다양한 브라우저에서 실용적인 Javascripit 솔루션은 다음과 같습니다.
var w = document.documentElement.clientWidth || document.body.clientWidth; var h = document.documentElement.clientHeight || document.body.clientHeight;
scrollWidth 및 scrollHeight는 웹 페이지 콘텐츠의 높이와 너비를 가져옵니다.
1 IE.Opera의 경우: scrollHeight는 clientHeight보다 작을 수 있는 웹 페이지 콘텐츠의 실제 높이;
2. NS.firefox의 경우: scrollHeight는 웹 페이지 콘텐츠의 높이입니다. 그러나 최소값은 clientHeight입니다. 즉, 웹페이지 콘텐츠의 실제 높이가 clientHeight보다 작을 경우, scrollHeight는 clientHeight를 반환합니다.
3. 브라우저 호환성 코드:
var w = document.documentElement.scrollWidth || document.body.scrollWidth; var h = document.documentElement.scrollHeight || document.body.scrollHeight;
1. 값: offsetWidth = scrollWidth + 왼쪽 및 오른쪽 스크롤 막대 + 왼쪽 및 오른쪽 테두리 OffsetHeight = 스크롤 높이 + 위아래 스크롤 막대 + 위쪽 및 아래쪽 테두리
2. 브라우저 호환성 코드:
var w = document.documentElement.offsetWidth || document.body.offsetWidth ; var h = document.documentElement.offsetHeight || document.body.offsetHeight ;
1 .scrollLeft:주어진 객체의 왼쪽 가장자리와 창에 현재 표시되는 콘텐츠의 가장 왼쪽 끝 사이의 거리를 설정하거나 가져옵니다.
2.scrollTop:Set; 또는 주어진 개체의 맨 위 지점과 창에 현재 표시되는 콘텐츠의 가장 왼쪽 끝 사이의 거리를 가져옵니다.
3.offsetLeft:설정 또는 가져오기; offsetParent 속성으로 지정된 레이아웃 또는 상위 좌표를 기준으로 계산된 특정 객체의 왼쪽 위치
4.offsetTop:주어진 위치를 설정하거나 가져옵니다. offsetParent 속성으로 지정된 레이아웃 또는 상위 좌표를 기준으로 계산된 지정된 개체의 상단 위치입니다.
브라우저의 다양한 너비와 높이를 얻는 방법에 대한 추가 js 관련 기사는 다음과 같습니다. 화면, PHP 중국어 웹사이트를 주목해주세요!