Javascript 在HTML中创建网格

我希望创建这样的网格：

我用这个：

$(document).ready(function() {
    for (var i = 0; i < 366; i++) {
        $('#div-padre').append('<div class="dia" id="div'+ i +'" /> ');
    }
});

---

我试图清除修复，但最后一个div出错了，我不在乎它们是div、tr还是其他什么，但将来我想选择一个正方形并更改颜色，所以div或tr或其他什么，我需要您稍后能够这样做

这是一个边界/轮廓管理问题，请看以下内容：

$document.readyfunction{ 对于变量i=0；i<366；i++{ $'div-padre'。追加“”； } }; .迪亚{ 宽度：45px； 高度：45px； 背景：白色； 边框：2倍实心； 浮动：左； 页边顶部：-2px； 左边距：-2px； } 教士{ 宽度：800px； } 使用边框：2倍实心；保证金：-1px；代替轮廓：2px实心

$document.readyfunction{ 对于变量i=0；i<365；i++{ $'div-padre' 追加 $, { id:'div-'+i+1， 班级：'dia' }; } }; .迪亚{ 宽度：45px； 高度：45px； 背景：白色； 边框：2倍实心； 保证金：-1px； 浮动：左； } 教士{ 宽度：800px； }

---

请尝试在append.append$，{id:'div-'+i，class:'dia'}之前创建一个元素，然后再追加。您可以使用css网格吗？如果是这样的话，这只是写一些css的例子。作为记录，不要在循环中更新html，将新的html文本推送到数组中，并在循环后更新一次，这将节省大量的渲染时间。使用overflow:hidden on div-padre.NB：您的代码将实际创建366个divs:PAlso最好先将必要的html构建为字符串，然后再附加一次字符串。好的，它可以工作，thx，我来自西班牙，在jquery上创建365个div，这是一个很好的实践吗？还是有另一种方式做同样的事情，但效率更高？THX可能会在附加到DOM之前创建所有div，从而获得更好的性能

.dia {
      width: 45px;
      height: 45px;
      background: white;
      outline: 2px solid;
      float: left;
  }

  .div-padre {
      width: 800px;
  }