在JavaScript中设置div高度

moo*_*law 1 javascript css

我有三个div具有相同类名的s,我想改变使用JavaScript的高度和颜色.我的代码坏了,不知道为什么.我在这里查看了类似问题的答案,我的代码似乎与解决方案相同.

我知道我的代码在哪里破解以及如何修复它?

<HTML>
<head></head>
<body>
    <div class="bar"></div>
    <div class="bar"></div>
    <div class="bar"></div>
    <script>
        function altSize() {
            var bar = document.getElementsByClassName("bar");
            bar.style.height = 200px;
            bar.style.background = 'red';
        }
        altSize();
    </script>
</body>
</HTML>
Run Code Online (Sandbox Code Playgroud)

Ben*_*aum 5

它在这里打破:

      bar.style.height=200px;
Run Code Online (Sandbox Code Playgroud)

原因是200px你不能在JS中分配它,它读取200并且不知道如何处理px,它不是有效数字.

而且,getElementsByClassName返回a NodeList而不是单个元素.

修复它

      for(var i=0;i<bar.length;i++){
           bar[i].style.height="200px";
      }
Run Code Online (Sandbox Code Playgroud)

小提琴