HTML.CSS.JS/JS

[JS] BOM, DOM 높이 / 너비

congs 2023. 4. 20. 16:29

BOM

: Browser Object Model = 브라우저 자체를 지칭하는 객체, window객체라고 함

DOM

: Document Onject Model

 

window.innerHeigth : 툴바를 제외한 높이 

window.innerWidth : 스크롤바를 포함한 너비 

  • 위도우와 브라우저 화면 배율에 따라 달라짐
  • 크기를 바꾸고 f5시 높이와 너비가 바껴서 알려줌

 
 
<body>
    <ul>
        <li id="ih">
            window.innerHeight :
        </li>
        <li id="iw">
            window.innerWidth :
        </li>
    </ul>

    <script>
        let ih = window.innerHeight;
        let iw = window.innerWidth;
        document.getElementById('ih').innerText += ih;
        document.getElementById('iw').innerText += iw;
    </script>
</body>