Question

我有以下循环给我带来问题

$("#divResults").append('<table>');

$.each( results.d, function( index, record ) {
    $("#divResults").append('<tr><td>' + record.ClientCode + '</td></tr>');
});

$("#divResults").append('</table>');

由于某些原因，基于谷歌chromes开发人员工具，上面的代码生成以下html

<table></table>
<tr><td>Code 1</td></tr>
<tr><td>Code 2</td></tr>
<tr><td>Code 3</td></tr>
<tr><td>Code 4</td></tr>
<tr><td>Code 5</td></tr>
<tr><td>Code 6</td></tr>
<tr><td>Code 7</td></tr>

如何解决此问题以生成正确的HTML？

Answer 1

jQuery在元素而非标签上运行。

您不能添加开始标记，然后添加一些内容，然后添加结束标记。

var html = '<table>';
$.each( results.d, function( index, record ) {
    html += '<tr><td>' + record.ClientCode + '</td></tr>';
});
html += '</table>';
$("#divResults").append(html);

Answer 2

var table = $("<table></table>");

$.each( results.d, function( index, record ) {
    var row = $("<tr></tr>");
    var cell = $("<td></td>").text(record.ClientCode).appendTo(row);
    table.append(row);
});
$("#divResults").append(table);

Answer 3

您也可以通过dom：document.getElementById('divResults).innerHTML= "<table><tr><td>Hi ! I am new table</td></tr></table>"
执行此操作

在div标签内附加一个表

3 个答案: