javascript - 使用纯js为特定类的所有div设置高度

嗨，我正在尝试做一些我认为在javascript中应该不会很难的事情，但我无法使其正常工作。我有许多div类别为nav-img的文本，其宽度为20％。无论窗口的大小如何，我都希望div的纵横比始终相同。高度应为宽度1.35。这是我尝试的：

var vNavimg = document.getElementsByClassName("nav-img");
var vNavWidth = window.getComputedStyle(vNavimg).width;
window.onload = setHeight;

function setHeight() {
    vNavimg.style.height = vNavWidth/1.35+"px";
}

最佳答案

如此接近，方法getElementsByClassName()返回以给定类作为参数的对象的数组，您应该遍历它们并分配新的高度：

var vNavimg = document.getElementsByClassName("nav-img");

for(var i=0;i<vNavimg.length;i++){
    vNavimg[i].style.height = vNavWidth/1.35+"px";
}

或使用功能setHeight()：

var vNavimg = document.getElementsByClassName("nav-img");

for(var i=0;i<vNavimg.length;i++){
    setHeight(vNavimg[i]);
}

function setHeight(div) {
    div.style.height = vNavWidth/1.35+"px";
}

希望这可以帮助。