在IE的表中追加tr
在IE的表中追加tr
提问于 2011-08-30 16:20:30
我有一个表结构：
<table id="tableId">
<tbody id="tbodyId">
<tr id="trId1">
<td>id</td><td>name</td>
</tr>
</tbody>
</table>我正在使用简单的Javascript添加新行，如下所示：
var itemsContainer = dojo.byId('tbodyId');
itemCount++; //it will give id to tr i.e. trId2
var newItemNode = document.createElement('tr');
newItemNode.setAttribute("id", 'trId' + itemCount);
newItemNode.innerHTML ='<td>id</td><td>anotherName</td>';
itemsContainer.appendChild(newItemNode);在Firefox中一切正常，但在IE中不追加行。在Firefox中，它后面的新表变成：
<table id="tableId">
<tbody id="tbodyId">
<tr id="trId1">
<td>id</td><td>name</td>
</tr>
<tr id="trId2">
<td>id</td><td>anotherName</td>
</tr>
</tbody>
</table>我看到了其他代码和帮助。我只想在这个表中有一个简单的Javascript没有jQuery的tbody。
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-08-30 16:28:40
有一些特殊的函数用于创建表格单元格(和行)，例如用于行的insertRow和用于单元格的insertCell -它适用于所有浏览器
var newItemNode = itemsContainer.insertRow( itemsContainer.rows.length - 1 );
newItemNode.setAttribute("id", 'trId' + itemCount);
var cell = newItemNode.insertCell( 0 );
cell.innerHTML = 'id';..。
PS。我认为DOJO框架具有插入行和单元格的功能
Stack Overflow用户
发布于 2011-08-30 16:31:53
首先，this jsfiddle在FF6和IE8中运行良好
确保你真正的html有正确的标记。您的示例显示了不带斜杠的闭合tbody元素
<tr id="trId2">
<td>id</td><td>anotherName</td>
</tr>
<tbody> <!-- This line should be </tbody> -->IE与其接受的错误标记不一致。
此外，代码如下所示：
var newItemNode = document.createElement('tr');
newItemNode.setAttribute("id", 'trId' + itemCount);
newItemNode.innerHTML ='<td>id</td><td>anotherName</td>';正是像dojo (及其更聪明的表亲jQuery)这样的工具包要避免的代码。我怀疑创建新行的代码在你测试的IE版本中是不同的。
Stack Overflow用户
发布于 2011-08-30 16:38:13
尝尝这个
<html>
<script language = "javascript">
function kk()
{
var itemsContainer = document.getElementById("tbodyId");
var newItemNode = document.createElement('tr');
newItemNode.setAttribute("id", 'trId' + 1);
var newCellItem1 = document.createElement('td');
newCellItem1.innerHTML = "id";
var newCellItem2 = document.createElement('td');
newCellItem2.innerHTML = "anotherName";
newItemNode.appendChild(newCellItem1);
newItemNode.appendChild(newCellItem2);
itemsContainer.appendChild(newItemNode);
}
</script>
<table id="tableId">
<tbody id="tbodyId">
<tr id="trId1">
<td>id</td><td>name</td>
</tr>
</tbody>
</table>
<input type="button" value = "heihei" onclick = "kk();"></input>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7240464
复制相关文章
相似问题
腾讯云开发者
