Question

我发现document.body.clientWidth可以用作实际的客户端宽度，即使窗口中没有任何显示。如果缩放窗口，则值将更改为动态。但是如果窗口中没有显示任何内容，在不使用任何JQuery Libs的情况下，如何知道实际的客户端高度？我的代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta content="width=device-width, initial-scale=1.0, user-scalable=no" name="viewport" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>
</title>
<style type="text/css">
body
{ 
    margin:0px;
    padding:0px;
    border:0px;
/*    border-color:#FEFEFE;*/
/*    background-image:url(bg.png);*/
    background-repeat: repeat;
    display:block;
    z-index:-9999;
    width:100%;
    height:100%;
    left:0px;
    top:0px;
}
div
{
    background-color:#a0a0a0;
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    display:block;
    z-index:-8888;
}
</style>
</head>

<body id="body">
<div id="bg">
<span id="s1">
test
</span>
</div>
</body>
<script type="text/javascript">
    (function (d) {
        setInterval(function () {
            w = d.body.clientWidth;
            document.title = w;
        }, 1);
    })(document)
</script>
</html>

Answer 1

您可以使用 window.innerHeight ，如下所示：

var intViewportHeight = window.innerHeight;

根据Mozilla MDN：window.innerHeight检索浏览器窗口视口的高度（以像素为单位），包括（如果已渲染）水平滚动条。

以下是plunker示例。

如何在没有任何JQuery Lib的情况下了解实际的客户端高度？

1 个答案: