这获取屏幕宽高的有什么区别

window.innerWidth；
document.documentElement.clientWidth；
document.body.clientWidth；

解决方案 »

  1.   

    scrollWidth  
    是对象的实际内容的宽，不包边线宽度，会随对象中内容的多少改变（内容多了可能会改变对象的实际宽度）。 
    clientWidth  
    是对象可见的宽度，不包滚动条等边线，会随窗口的显示大小改变。  
    offsetWidth  
    是对象的可见宽度，包滚动条等边线，会随窗口的显示大小改变。  <style>
    * {
    margin:0;
    padding:0;
    }
    html {
    margin:50px;
    border:10px solid #0ee;
    }
    body {
    margin:50px;
    border:10px solid #e0e;
    }
    </style>
     
    </head>
    <body>
    <div id='w1'></div>
    <div id='h1'></div>
    <div id='b1'></div><script type="text/javascript">var $a=window.innerWidth;
    //var $a=window.clientWidth;
    var $b=document.documentElement.clientWidth;
    //var $b=document.documentElement.innerWidth;
    var $c=document.body.clientWidth;
    document.getElementById("w1").innerText = $a;
    document.getElementById("h1").innerText = $b;
    document.getElementById("b1").innerText = $c;
    </script></body>
    </html>