淺談window、document、html和body的區(qū)別

在學(xué)習(xí)html的過程中,很多同學(xué)都會把window、doucment、 html和body四者混淆,現(xiàn)將四者的區(qū)別進(jìn)行分別闡述:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        *{
            margin:0;
            padding:0;
        }
        #box{
            width:100px;
            height:100px;
            background:aqua;
        }
    </style>
    <script>
        window.onload=function(){
            //window的高度
            var oC=document.documentElement.clientHeight;
            alert(oC);
            //document的高度
            var oBox=document.getElementById("box");
            var scrollHeight=document.documentElement.scrollHeight;
            oBox.onclick=function(){
                alert(oBox.scrollHeight);               
            };
        };      
    </script>
</head>
<body>
    <div id="box"></div>
</body>
</html>

如上例子,我們可以簡單理解:
window的意思是窗口,它是指窗口大小的可視高度,不包括瀏覽器滾動條,
高度為document.documentElement.clientHeight;
document的意思是文檔,它是指具體的一個(gè)對象的內(nèi)容高度,高度為對象的document.documentElement.scrollHeight;
在代碼里面可以看到,body是包含在html里的,在標(biāo)準(zhǔn)瀏覽器里面html部分是等于body部分的。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • HTML精確定位:scrollLeft,scrollWidth,clientWidth,offsetWidth s...
    brightranger閱讀 1,146評論 0 1
  • Window和document對象的區(qū)別 window對象window對象表示瀏覽器中打開的窗口window對象是...
    FConfidence閱讀 2,368評論 0 5
  • 一、JS前言 (1)認(rèn)識JS 也許你已經(jīng)了解HTML標(biāo)記(也稱為結(jié)構(gòu)),知道了CSS樣式(也稱為表示),會使用HT...
    凜0_0閱讀 2,945評論 0 8
  • 毛毛細(xì)雨下 三月杏花開 我們的相遇是最美的意外 還記得 你手捧書卷的模樣 還嗅著 你身上散發(fā)的墨香 還憶著 ...
    鹿離lee閱讀 210評論 0 1
  • 一、信貸業(yè)務(wù)中涉及的重要的法律名詞釋義 1、標(biāo)的:法律關(guān)系。 2、標(biāo)的額:標(biāo)的對象和數(shù)量。如在借款合同中,借款標(biāo)的...
    寧嘉老爸閱讀 359評論 0 0

友情鏈接更多精彩內(nèi)容