在JAVASCRIPT中将div height设置为window.innerHeight_Javascript

在JAVASCRIPT中将div height设置为window.innerHeight

javascript

在JAVASCRIPT中将div height设置为window.innerHeight,javascript,Javascript,我想将元素的div高度设置为浏览器的innerHeight。我不希望css或jQuery在这里发生。它必须随窗口大小动态改变其高度。所以我制作了这个脚本，它并没有像我想的那样工作这是我的密码： window.onload= window.onresize=function(){ var left = document.getElementById("left"); var height = window.innerHeight; left.style.height =

我想将元素的div高度设置为浏览器的innerHeight。我不希望css或jQuery在这里发生。它必须随窗口大小动态改变其高度。所以我制作了这个脚本，它并没有像我想的那样工作

这是我的密码：

window.onload=
window.onresize=function(){
    var left = document.getElementById("left");
    var height = window.innerHeight;
    left.style.height = 'height +('px')';    
}

有人能纠正我的代码并使其正常工作吗。任何帮助都将不胜感激

多谢各位

您可以添加

高度：500px到左侧元素。看看我想要什么。但我需要适应浏览器的高度
已解决
//<![CDATA[ 
            function resize()
            {
                var heights = window.innerHeight;
                document.getElementById("left").style.height = heights -50 + "px";
            }
            resize();
            window.onresize = function() {
                resize();
            };
            //]]>  

//

多亏了蒂鲁玛莱·穆鲁甘的回答
window.onload = window.onresize = function () {
    var left = document.getElementById("left");
    var height = window.innerHeight;
    left.style.height = height + "px";
}

你在函数的最后一行出现了一个错误，现在应该可以工作了。
我发现的问题是窗口。在创建DOM元素之前可能会触发load
，你可以删除html，body
css，但这会给html，body
留出一些空白，如果你不想使用css，应该用javascript来处理，#left
css规则仅用于理解div高度
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>Thirumalai-Window size</title>
        <style type="text/css">
           #left{width:200px;background:red;}
           #inner{height:100%;overflow-y:scroll;}      
           html,body{margin: 0px;}
        </style>
    </head>
    <body>
        <div id="left"></div>
        <script type="text/javascript">//<![CDATA[ 
            function resize()
            {
                var heights = window.innerHeight;
                document.getElementById("left").style.height = heights + "px";
            }
            resize();
            window.onresize = function() {
                resize();
            };
            //]]>  

        </script> 
    </body>
</html>


蒂鲁玛莱窗口大小
#左{宽度：200px；背景：红色；}
#内部{高度：100%；溢出-y:滚动；}
html，正文{margin:0px；}
//  

更新
可以通过CSS3完成：
只需使用视口百分比长度设置div高度
div {
    height:100vh;
}

我通过以下方法解决了google地图容器的100%高度问题：
document.getElementById("map-canvas").style.height = document.getElementsByTagName("body")[0].offsetHeight + "px";

firebug控制台中是否有任何错误？没有，我无法得到任何错误。为什么需要这个？只需将高度：100%添加到“左”css:）我不能使用高度：100%。这里是因为我有一个高度为：100%的另一个div在这个div中，并使其溢出：scroll。所以我需要javascript来让这个工作如我所想的那样。你可以为此创建一个提琴吗？你的代码可以工作，但它有一些问题。它超过了a的高度little@Kishore请看这篇文章，它将给出足够的答案，解析器将忽略CDATA部分中的基本文本（非javascript浏览器不解析此文本的完整帮助）我想把这个边栏放在两个div之间。怎么做？@Vinoth请检查这是您的期望值吗？请注意，在移动设备中，这种方法存在潜在的陷阱。