jquery를 사용하지 않고 문서 높이와 너비를 얻는 방법

문서 높이와 너비를 순수로 얻는 방법 자바 스크립트 즉 사용하지 않고 jquery. 및 에
대해 알고 있지만이 작업을$(document).height()$(document).width()자바 스크립트.

페이지의 높이와 너비를 의미했습니다.

var height = document.body.clientHeight;
var width = document.body.clientWidth;

더 나은 설명을 위해이 기사 를 확인하십시오 .

http://www.howtocreate.co.uk/tutorials/javascript/browserwindow에 제공된 마지막 예제조차도 Quirks 모드에서 작동하지 않습니다. 내가 생각했던 것보다 쉽게 ​​찾을 수 있는데, 이것이 해결책 인 것 같습니다 (최신 jquery 코드에서 발췌).

Math.max(
    document.documentElement["clientWidth"],
    document.body["scrollWidth"],
    document.documentElement["scrollWidth"],
    document.body["offsetWidth"],
    document.documentElement["offsetWidth"]
);

높이를 얻으려면 너비를 "높이"로 바꾸십시오.

이것은 브라우저 간 솔루션입니다.

var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

getBoundingClientRect일반적으로 크로스 브라우저에서 작동 하고 경계 사각형에서 하위 픽셀 정밀도 를 제공 하므로 사용해야합니다 .

elem.getBoundingClientRect()

jQuery없이 문서 크기 가져 오기

document.documentElement.clientWidth
document.documentElement.clientHeight

그리고 화면 크기가 필요한 경우 이것을 사용하십시오.

screen.width
screen.height

시도해 볼 수도 있습니다.

document.body.offsetHeight
document.body.offsetWidth

이것은 모든 브라우저 / 장치에서 작동합니다.

function getActualWidth()
{
    var actualWidth = window.innerWidth ||
                      document.documentElement.clientWidth ||
                      document.body.clientWidth ||
                      document.body.offsetWidth;

    return actualWidth;
}

오버플로를 포함하여 페이지의 전체 너비를 얻으려면 document.body.scrollWidth.

문서 너비와 높이를 매우 쉽게 찾는 방법은 무엇입니까?

HTML
<span id="hidden_placer" style="position:absolute;right:0;bottom:0;visibility:hidden;"></span>

자바 스크립트

     var c=document.querySelector('#hidden_placer');

     var r=c.getBoundingClientRect();
     r.right=document width
     r.bottom=document height`

필요한 경우 모든 창 크기 조정 이벤트에서이를 업데이트 할 수 있습니다.

window전체 브라우저의 응용 프로그램 창입니다. document실제로로드 된 웹 페이지입니다.

window.innerWidth그리고 window.innerHeight당신이 원하는하지 않을 수 있습니다 계정에 스크롤바를 취할 것입니다.

document.documentElement상단 스크롤바가없는 전체 웹 페이지입니다. document.documentElement.clientWidthy 스크롤바없이 문서 너비 크기를 반환합니다. document.documentElement.clientHeightx 스크롤바없이 문서 높이 크기를 반환합니다.