javascript设置样式宽度80%?

时间:2013-11-26 19:58:13

标签: javascript styles percentage

我想将对象的宽度设置为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%";
}

}

2 个答案:

答案 0 :(得分:2)

更新:您仍未访问结果集的各个成员。您需要遍历getElementsByClassName的结果,因为您仍在尝试在结果集合上设置样式属性而不是单个结果。您还需要在致电getElementsByClassName后致电querySelectorAll,或者当您到达divs区块时,else if var将超出范围。你应该能够弄清楚如何从原始答案中构造你的循环,所以我将保留它未经编辑:


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

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

请注意childNodes将包含id元素为“section”的DOM元素的所有子元素,因此如果在“section”DOM元素下有其他子元素不是div,那么想要应用这种样式,你需要进一步过滤。

答案 1 :(得分:1)

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

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