jquery 关于table的子标签tbody

jquery 关于table的子标签tbody

<table>
<tr><td>1</td></tr>
<tr><td>2</td></tr>
</table>

上面是一段很简单的html代码，工作中用到了这样一个table

?

<table> <tr><th>1</th></tr> <tbody></tbody> </table>

我想通过jquery动态操作tbody的html();

然后我写了这样的代码：

1 var html = "<tr><td>我是tbody</td></tr>";
2 
3 $("table tbody").html(html);

然后我发现页面变成了

?

< table > < tr >< td >我是tbody</ td ></ tr > < tbody ></ tbody > </ table >

经过一番测试，发现用js获取table下tbody 通过table下的子元素tbody这种方式不一定会得到我们想要的结果。

因为 table标签 默认会有一个tbody 这个tbody就是table下面所有的tr。

所以当我们在table下没有写tbody或者thead的时候

$("table tbody")就相当于$("table");
如果我们在table下只写了tbody标签，并没有把所有的tr包含进去，那么$("table tbody")会获得与我们恰好相反的结果，也就是上面的代码，会把我们自己声明的tbody里的内容排除在外，取得table里面tbody外面的内容。

好了！简单的问题。解决方案也很简单：

?

< table > < thead >< tr >< th >head</ th ></ tr ></ thead > < tbody >< tr >< td >body</ td ></ tr ></ tbody > </ table >

不要偷懒，用标准的写法，将thead tbody写全，就不会出问题了，妥妥儿的@@