这样一段代码
<table><tr id="user">
</tr></table>
<script>
document.getElementById("user").innerHTML="<td>hello</td>";
</script>
这个时候就会出行 运行时异常
这是因为在 html 很多标签 如 table tr 这些标签对innerHTML的支持并不好
但是像div span 就支持的很好 建议用innerHTML时使用div与span
这样一段代码
<table id="user">table>
<script>
var table=document.getElementById("user");
var tr=document.createElement("tr");
var td=document.createElement("td");
var div=document.createElement("div");
div.innerHTML="大家好";
td.appendChild(div);
tr.appendChild(td);
table.appendChild(tr);
</script>
这段代码的意思很明显 就是在当前table上添加一行一列 并且行内添加div 显示字体 大家好
但是调用这段代码后 结果没有任何东西 为什么了
因为 table的appendChild自能appendChild table中的下一节点
table的下一级几点是tbody 所以加不进去
修改成这样就可以了
<table id="user"><tbody id="user"></tbody><table>
<script>
var table=document.getElementById("user");
var tr=document.createElement("tr");
var td=document.createElement("td");
var div=document.createElement("div");
div.innerHTML="大家好";
td.appendChild(div);
tr.appendChild(td);
table.appendChild(tr);
</script>
结果出来了
就算你只写了<table id="user"><table>
你打印一下 document.getElementById("user").innerHTML;
他也会出来一个 <tbody></tbody>