javascript - jquery 有更好的循环吗？

Question

我正在 javascript 中执行此操作，只是想知道是否可以使用更多 jquery 更优雅地解决它？

var tbl="";
    for(var i=1; i<13; i++) {
        // creating 12 div's, one for each month
        tbl += "<div class='month' id='m"+i+"'>" + months[i-1];

        // creating 31 divs for each day in month
        for(var j=1; j<32; j++) { 
            tbl += "<div class='monthday' id='m"+i+"d"+j+"'>"+
                        "<div class='date_header'>"+j+"</div>" +
                        "<div class='date_info'></div>" +
                   "</div>";
        }
        // close month-div
        tbl += "</div>";

        // insert a clear for each 4th month to get a nice style-break
        if(i==4 || i==8 || i==12) {
            tbl += "<br style='clear: both'>";
        }
    }

    // finished
    $("#friendsinfo").html(tbl);

Answer 1

查找jQuery Templates 。它们允许您做您正在做的事情，而无需像这样在循环中手动连接字符串。这是其工作原理的示例:

var template = '<a href="${link}" id="{$id}">${anchor}</a>';
$.template('myTemplate', template);
var data = [];
for (var x = 0; x < something.length; x++) {
    var newLink = {
        link: something[x].url,
        id: 'mylink-' + something[x].id,
        anchor: something[x].title
    };
    data.push(newLink);
}

$.tmpl('myTemplate', data).appendTo('#myContainer');

我已经在几个项目中使用它们，它们在构建复杂的 HTML block 方面创造了奇迹。