[英]Close and open another div after the loop increments by 3 every time
我有一个阵列。 我正在循环。 首先我需要的是,当首先运行循环时,它应该已经打开一个div并向其添加文本。 接下来我想要一个循环运行3次然后关闭前一个div并打开一个新的div。
码:
var counter = 0;
for (var i = 0; i < tag_array.length; i++) {
counter++;
if (counter == 3) {
counter = 0;
document.write("</div>");
document.write("<div class='span6'>");
} else {
document.write("<div class='span6'>");
}
document.write("<div class='tag'>" + toTitleCase(tag_array[i]) + "</div>");
}
上面的代码不起作用。 我不知道为什么。 请解释一下我做错了什么,我该如何解决?
当循环首先运行时,它应该已经打开一个div并向其添加文本。 接下来我想要一个循环运行3次然后关闭前一个div并打开一个新的div。
你做错的原因是因为else { document.write("<div class='span6'>");}
即使在counter为2时也会导致document.write
。
所以else if(counter == 1)
你应该把它改成else if(counter == 1)
:
var counter = 0;
for (var i = 0; i < tag_array.length; i++) {
//this line indicates that the counter will only be either 1,2,3 when it enters the if statement
counter++;
if(counter == 3){
counter = 0;
document.write("</div>");
}else if(counter == 1){
document.write("<div class='span6'>");
}
document.write("<div class='tag'>" + toTitleCase(tag_array[i]) + "</div>");
}
为了使它看起来不那么混乱,你可以将if语句更改为switch语句,具有counter++;
在switch语句中,将for语句转换为while语句:
var counter = 0;
var i = 0;
var length = tag_array.length;
while (i <length) {
switch(counter){
case 2:
document.write("</div>");
//when counter reaches 2, set it back to 0 and leave the switch statement;
counter = 0;
break;
case 0:
document.write("<div class='span6'>");
case 1:
//counter++ will only be triggered when counter is 1 or 0;
counter++;
}
document.write("<div class='tag'>" + toTitleCase(tag_array[i]) + "</div>");
i++;
}
或者,如果您想提高效率,可以使用以下代码。 ) (受到frenchie的回答的启发。我纠正了他的答案,正确的答案。 )
var a = '<div class="span6">';
var length = tag_array.length;
for (var i = 0; i < length; i++) {
a += '<div class="tag">' + toTitleCase(tag_array[i]) + '</div>';
if (i % 3 == 2) {
a += '</div><div class="span6">';
}
}
a += '</div>';
document.write(a);
您正在打开另一个span
而不是每次迭代都关闭它,因此您应该从循环中取出第一个跨度。
这应该工作,我还在循环结束时添加了另一个</div>
var counter = 0;
document.write("<div class='span6'>");
for (i = 0; i < tag_array.length; i++) {
if (counter === 3) {
counter = 0;
document.write("</div>");
document.write("<div class='span6'>");
}
document.write("<div class='tag'>" + toTitleCase(tag_array[i]) + "</div>");
counter++;
if (i === tag_array.length - 1) {
document.write("</div>")
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.