Question

         <html>
    <div id="wrapper">
    <div class="hidden"></div>                    (pay no attention to hidden divs)
    <div class="hidden"></div>                    (pay no attention to hidden divs)
    <div class="hidden"></div>
    <div class="box"></div>
    <div class="box"></div> 
    <div class="box"></div>
    <div class="box"></div>
             </html>

               <css>
               .hidden{
               visibility:hidden; 
               width:110px;
               float:left;
               border:1px solid red;
               height:100px;
              text-align:right;
              vertical-align:top;
              font-size:30px;
              overflow:hidden;
              }
            .box{
    margin:5px;
    width:100px;
    float:left;
    border:1px solid black;
    height:100px;
    text-align:right;
    vertical-align:top;
    font-size:30px;
    }
            </css>

我可以编写什么javascript循环来填充框div以便循环通过所有28个盒子。这是一个日历，如果它有助于描述我试图用什么生成 for循环我试图理解但无法理解功能
需要。这是如此基本，我需要重新审视javascript？非常感谢您的帮助。只显示html和css布局和选择器，以便您使用了解请随时询问更多内容如果这还不够，可以提供帮助。

Answer 1

我会避免将这些框添加到HTML中，并使用JavaScript将它们添加到页面中，方法是将HTML框添加到数组并将其连接到包装器：

var el = document.getElementById('wrapper');
var html = [];
for (var i = 1, l = 28; i <= l; i++) {
  html.push('<div class="box">' + i + '</div>');
}
el.innerHTML = html.join('');

Fiddle

Answer 2

使用jQuery：

$(function() {
    $('div.box').each(function(i) {
        $(this).text(i+1);
    });
});

请参阅小提琴：http://jsfiddle.net/magnafides/skFQS/2/

Answer 3

类似的东西：

var divs = document.getElementsByClassName("box");
for (var i=0; i < divs.length; i++)
{
    divs[i].innerHTML = i+1;
}

http://jsfiddle.net/RzqL3/1/

如果其他非div元素与box类有关，那么您需要检查nodeName以过滤掉它们。

for循环（Javascript）用1-28填充空div

3 个答案: