使用jQuery创建表格- append
使用jQuery创建表格- append
提问于 2012-01-06 04:23:32
我在div页上有：
<div id="here_table"></div>在jquery中：
for(i=0;i<3;i++){
$('#here_table').append( 'result' + i );
}这为我生成了：
<div id="here_table">
result1 result2 result3 etc
</div>我想在表格中收到这个：
<div id="here_table">
<table>
<tr><td>result1</td></tr>
<tr><td>result2</td></tr>
<tr><td>result3</td></tr>
</table>
</div>我在做：
$('#here_table').append( '<table>' );
for(i=0;i<3;i++){
$('#here_table').append( '<tr><td>' + 'result' + i + '</td></tr>' );
}
$('#here_table').append( '</table>' );但这对我产生了影响：
<div id="here_table">
<table> </table> !!!!!!!!!!
<tr><td>result1</td></tr>
<tr><td>result2</td></tr>
<tr><td>result3</td></tr>
</div>为什么？我如何才能正确地进行此操作？
回答 14
Stack Overflow用户
回答已采纳
发布于 2012-01-06 04:30:57
这一行：
$('#here_table').append( '<tr><td>' + 'result' + i + '</td></tr>' );追加到div#here_table，而不是新的table。
有几种方法：
/* Note that the whole content variable is just a string */
var content = "<table>"
for(i=0; i<3; i++){
content += '<tr><td>' + 'result ' + i + '</td></tr>';
}
content += "</table>"
$('#here_table').append(content);但是，使用上面的方法，添加样式和使用<table>动态执行操作的可管理性较差。
但是这个怎么样，它做了你所期望的几乎很棒的事情：
var table = $('<table>').addClass('foo');
for(i=0; i<3; i++){
var row = $('<tr>').addClass('bar').text('result ' + i);
table.append(row);
}
$('#here_table').append(table);希望这能有所帮助。
Stack Overflow用户
发布于 2012-01-06 04:28:15
当您使用append时，jQuery希望它是格式良好的超文本标记语言(纯文本计数)。append不像做+=。
您需要先制作表，然后再追加它。
var $table = $('<table/>');
for(var i=0; i<3; i++){
$table.append( '<tr><td>' + 'result' + i + '</td></tr>' );
}
$('#here_table').append($table);Stack Overflow用户
发布于 2012-10-18 02:51:59
或者以这种方式使用所有jQuery。each可以遍历任何数据，可以是DOM元素，也可以是数组/对象。
var data = ['one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight'];
var numCols = 1;
$.each(data, function(i) {
if(!(i%numCols)) tRow = $('<tr>');
tCell = $('<td>').html(data[i]);
$('table').append(tRow.append(tCell));
});
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8749236
复制相关文章
相似问题
腾讯云开发者
