<table id="tab">
<tr><td>第一行文字</td></tr>
</table>
<buttononclick="insertHtml();">插入</button>
<script type="text/javascript">
functioninsertHtml() {
$("#tab tbody").append("<tr><td>第二行文字</td></tr>");
alert($("#tab").html());
}
</script>
操作完成后的代码为
<table id="tab">
<tbody>
<tr><td>第一行文字</td></tr>
<tr><td>第二行文字</td></tr>
</tbody>
</table>
浏览器会在table中加tbody标签, 如用$("#tab").append("<tr><td>第二行文字</td></tr>"),则会生成以下错误代码
<table id="tab">
<tbody>
<tr><td>第一行文字</td></tr>
</tbody>
<tr><td>第二行文字</td></tr>
</table>
</table>
<buttononclick="insertHtml();">插入</button>
<script type="text/javascript">
</script>
操作完成后的代码为
<table id="tab">
</table>
浏览器会在table中加tbody标签, 如用$("#tab").append("<tr><td>第二行文字</td></tr>"),则会生成以下错误代码
<table id="tab">
</table>
本文介绍如何使用jQuery在表格中动态添加新行,并确保DOM结构正确。通过具体示例展示了正确的做法与常见错误,帮助读者理解如何避免DOM结构错误。
977

被折叠的 条评论
为什么被折叠?



