如何将样式应用于 javascript 中的类？

Question

我的身体中有多个需要相同样式的 div：

<div class="box"></div>

我有一个 javascript 计算浏览器窗口视口高度的高度。我想将该高度应用于我所有的“盒子”分类 div。

<script type="text/javascript">
var box = document.getElementsByClassName('box')[0];
var height = (window.innerHeight) ? window.innerHeight: document.documentElement.clientHeight;
box.style.height=(height)+'px';
</script>

这有效，但只有一个 div，它不会使第二个“框”div 与前一个高度相同。如果我将方括号中的数字从 0 更改为 1，它会将高度应用于第二个 div。另外，如果我制作了 javascript 的第二个副本，以便第一个脚本具有 [0] 和第二个 [1]，它将高度应用于两个 div。我无法删除方括号，因为 javascript 根本不起作用。我也尝试使用 getElementsByTagName 获取名称但没有成功。

我怎样才能让这个 javascript 将相同的高度应用于所有具有“box”类的 div？还是有另一种方法可以做我想做的事情？

Answer 1

尝试以下操作：

var elems = document.getElementsByClassName('box'),
    size = elems.length;

for (var i = 0; i < size; i++) {

var box = elems[i];
var height = (window.innerHeight) ? window.innerHeight: document.documentElement.clientHeight;
box.style.height=(height)+'px';
}

演示：http : //jsfiddle.net/JRdHD/