Question

我已经给了div一个col-xs-4类来使它们均匀分布。但这只有3 div时才有效。如果号码改变怎么办？如何动态更改col-xs-#以正确调整，以便它们仍然均匀展开？我无法将任何数字或标记从我的JS文件传递给css，所以不知道我该怎么做。

Answer 1

var childCount = document.getElementById("myDIV").childElementCount;
for(i = 0; i < childCount; i++) {
   document.getElementById("myDIV").children[i].className = "";
   document.getElementById("myDIV").children[i].className = "col-xs-" + (12/childCount);
}

这个javascript首先获取你的bootstrap行中的子节点数（在这种情况下它有id myDIV），然后它会在清除类并根据childcount设置新的col-xs- *类时循环遍历这些子节点。

请参阅以下jsfiddle以了解正在运行的代码： https://jsfiddle.net/vf65vooL/3/

将引导网格系统动态调整为显示的项目数

1 个答案: