javascript设置样式宽度80%

javascript set style width 80%?

本文关键字:样式 设置 javascript      更新时间:2023-10-18

我想将对象的宽度设置为80%。父div宽度为100%

怎么了?

var howManyDivsIHave = document.querySelectorAll('#section div.divs').length;
if(howManyDivsIHave == "1"){
    var divs = document.getElementById("section").getElementsByClassName("divs");
    divs.style.width = "80%"; 
    divs.style.height = "80%";
    divs.style.margin = "10%";
}
else if (howManyDivsIHave == "2"){
    divs.style.width = "40%"; 
    divs.style.height = "40%";
    divs.style.margin-top = "30%";
    divs.style.margin-bottom = "30%";
    divs.style.margin-left = "5%";
    divs.style.margin-right = "5%"; 
}
else if (howManyDivsIHave == "3"){
    divs.style.width = "40%"; 
    divs.style.height = "40%";
    divs.style.margin = "5%";
}

}

UPDATE:您仍然无法访问结果集的各个成员。您需要迭代getElementsByClassName的结果,因为您仍在尝试为结果集合而不是单个结果设置样式属性。您还需要在调用querySelectorAll之后立即调用getElementsByClassName,否则当您到达else if块时,divs var将超出范围。你应该能够从原始答案中找出如何构建循环,所以我不做编辑:


childNodes是一个数组。您需要遍历数组,并在每个单独的元素上设置样式。在您发布的代码中,您设置的是数组的样式,而不是单个DOM元素。试试之类的东西

var divs = document.getElementById("section").childNodes;
for (var i = 0; i < divs.length; i++)
{
    divs[i].style.width = "80%"; 
    divs[i].style.height = "80%";
    divs[i].style.margin = "10%";
}

注意CCD_ 7将包含id为"0"的DOM元素的所有子元素;"部分";,因此,如果在";部分";如果您不想将此样式应用于DOM元素,则需要进行进一步的筛选。

childNodes是一个NodeList或数组。您需要迭代并将该样式添加到各个项目中:

for(i=0;i<divs.length;i++){
    divs[i].style.width = "80%";
    divs[i].style.height = "80%";
    divs[i].style.margin = "10%";
}