jquery 动态的添加表格

使用jQuery动态更新表格

最新推荐文章于 2023-10-02 12:46:33 发布

原创最新推荐文章于 2023-10-02 12:46:33 发布 · 268 阅读

1 ·

CC 4.0 BY-SA版权

jquery 专栏收录该内容

3 篇文章

订阅专栏

本文介绍如何使用jQuery库来动态地向HTML表格中添加行和数据。通过具体示例展示了如何构建新的表格行并将其插入到指定位置。

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var trHTML = "<tr><td align=\"center\">111</td><td align=\"center\">222</td><td align=\"center\">333</td></tr>";
$("#tab").append(trHTML);
var trHTML = "<tr><td >444</td><td >555</td><td >666</td></tr>";
$("#tab").append(trHTML);
//向第二行添加数据
var trHTML = "<tr><td >aaa</td><td >bbb</td><td >ccc</td></tr>";
$("#tab tr:eq(1)").after(trHTML);
});
</script>
</head>
<body>
<table id="tab" border=1>
<tr>
<td >IPV4</td><td >IPV6地址</td><td >MAC地址</td>
</tr>
</table>
</body>

</html>

效果图: