$(document).ready(function() {
// 假设这是我们要动态插入表格的数据
var data = [
{ id: 1, name: "Alice", age: 25 },
{ id: 2, name: "Bob", age: 30 },
{ id: 3, name: "Charlie", age: 35 }
];
// 动态创建表格并添加到body中
var table = $("<table border='1'></table>");
var thead = $("<thead><tr><th>ID</th><th>Name</th><th>Age</th></tr></thead>");
table.append(thead);
$.each(data, function(index, item) {
var tr = $("<tr></tr>");
tr.append($("<td>" + item.id + "</td>"));
tr.append($("<td>" + item.name + "</td>"));
tr.append($("<td>" + item.age + "</td>"));
table.append(tr);
});
$("body").append(table);
});
这段jQuery代码演示了如何在页面加载完成后动态地生成一个表格,并将一些数据填充到表格中。首先,我们定义了一个包含数据的数组`data`。然后,我们创建了一个表格的HTML元素,并为其添加了表头和表体(通过遍历`data`数组动态生成每一行)。最后,我们将这个表格元素添加到`body`中。