> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트는 창(컨테이너) 열거 및 간략한 설명의 크기 및 위치 매개변수를 얻습니다._기본 지식

자바스크립트는 창(컨테이너) 열거 및 간략한 설명의 크기 및 위치 매개변수를 얻습니다._기본 지식

WBOY
풀어 주다: 2016-05-16 17:47:13
원래의
1106명이 탐색했습니다.

Javascript는 창(컨테이너)의 크기와 위치를 가져옵니다. 혼동하기 쉬운 항목이 많이 있습니다. 다음은 목록과 간략한 설명입니다.

속성 메서드 설명:
clientX 관련 문서 스크롤 높이의 수평 좌표
scrollLeft는 개체의 왼쪽 가장자리와 창에 현재 표시되는 콘텐츠의 가장 왼쪽 끝 사이의 거리를 설정하거나 가져옵니다.
scrollTop은 거리를 설정하거나 가져옵니다. 개체의 맨 위 가장자리와 창 거리에서 가장 위쪽에 보이는 콘텐츠 사이;
offsetWidth는 레이아웃을 기준으로 개체의 너비를 가져오거나 부모 좌표 offsetParent 속성으로 지정된 부모 좌표를 가져옵니다.
offsetHeight는 높이를 가져옵니다. 부모 좌표 offsetParent 속성에 의해 지정된 레이아웃 또는 부모 좌표를 기준으로 한 개체의
offsetLeft는 offsetParent 속성으로 지정된 레이아웃 또는 부모 좌표를 기준으로 개체의 계산된 왼쪽 위치를 가져옵니다. offsetTop 속성으로 지정된 레이아웃 또는 상위 좌표를 기준으로 계산된 개체의 상단 위치.


화면 및 창 크기를 가져오는 자바스크립트 방법
:
화면 해상도 높이: window.screen.height;
화면 해상도 너비: window.screen.width;
사용 가능한 화면 작업 영역 높이(작업 표시줄 제외): window.screen.availHeight; 화면(작업 표시줄 제외): window.screen.availWidth;
웹 페이지의 표시 영역 너비(스크롤 막대 및 테두리 제외): document.body.clientWidth 높이; 웹 페이지의 표시 영역(스크롤 막대 및 테두리 제외): document.body.clientHeight 웹 페이지의 표시 영역 너비(스크롤 막대 및 테두리 포함): document.body .offsetWidth;
웹 페이지의 표시 영역 높이(스크롤 막대 및 테두리 포함): document.body.offsetHeight
웹 페이지 본문 너비: document.body.scrollWidth; 본문 높이: document.body.scrollHeight;
스크롤할 높이: document.body.scrollTop
스크롤할 왼쪽: document.body.scrollLeft; 웹페이지(웹페이지의 가장 왼쪽과 화면의 왼쪽 가장자리 사이의 거리): window.screenTop
웹페이지의 텍스트 부분의 왼쪽(웹페이지의 텍스트 상단과 화면의 왼쪽 가장자리 사이의 거리) 화면 상단 가장자리): window.screenLeft.


참고: html 때문에 값을 얻을 수 없는 경우가 있습니다. 문서 유형
이 파일 헤더에 추가됩니다:



,
이때 document.body.scrollTop 및 document.body.scrollLeft는 document.documentElement.scrollTop 및 document.documentElement.scrollLeft로 충분하며 document.body.clientWidth 및 document.body.clientHeight도 다음으로 변경되어야 합니다. document.documentElement.clientWidth 및 document.documentElement.clientHeight

물론 누락되거나 설명이 부족한 부분이 있습니다. 모두가 추가하거나 토론하거나 Baidu Baidu를 통해 함께 진행할 수 있습니다. ! 응~

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿