javascript - 动态地将 's 添加到表中

Question

我正在尝试从今天开始创建一个包含 30 天日期的表格。

现在我有这个工作，但它被作为一个字符串返回。

我想添加一个<td>返回到我的表的每个日期。

我的代码是这个

HTML

<table>
<tbody>
    <tr>
        <td></td> <!-- Add Each Date here -->
    </tr>

</tbody>
</table>

JS

var date = moment(),
    begin = moment(date).startOf('week').isoWeekday(1);

var str = "";
for (var i=0; i<30; i++) {
    str += begin.format("MMM Do") + '<br>';
    begin.add('days', 1);
}

// Would like to add date to each <td> and add <td> to the table
document.body.innerHTML = str;

演示

Answer 1

只需对现有代码稍加补充，请参见下文，

var date = moment(),
    begin = moment(date).startOf('week').isoWeekday(1);

var str = [];
for (var i=0; i<30; i++) {
    str.push('<td>' + begin.format("MMM Do") + '</td>');
    begin.add('days', 1);
}

$('#myTable tbody').append('<tr>' + str.join('') + '</tr>');

演示：http: //jsfiddle.net/wzdr2/

Answer 2

这应该有效：

for (var i=0; i<30; i++) {
    $("table tr").append("<td>" + begin.format("MMM Do") + "</td>");
    begin.add('days', 1);
}

Answer 3

尽量不要每次都附加到 DOM，这会使其速度变慢且效率低下，尤其是在要附加的项目太多的情况下。而是将它们加起来并在最后追加。

var str = "", $tds= [];
for (var i=0; i<30; i++) {
    $tds.push('<td>' + begin.format("MMM Do") + '</td>'); //push the tds to the temp array
    begin.add('days', 1);
}

// Would like to add date to each <td> and add <td> to the table
$('table tr').append($tds); //append in the end

演示

Answer 4

您可以随时附加它们。像这样...

http://jsfiddle.net/jzKMS/

for (var i=0; i<30; i++) {
    $('#dates tbody').append('<tr><td>' + begin.format("MMM Do") + '</td></tr>');
    begin.add('days', 1);
}

或者，为了更快地运行，首先构建您的元素并在最后追加一次。