javascript - 在表中动态插入新行

标签 javascript insert html-table row cells

<script type="text/javascript" language="javascript">
 function addNewRow()
 {
    var table = document.getElementById("table1");
    var tr = table.insertRow();
    var td = tr.insertCell();
    td.innerHTML= "a";

    td = tr.insertCell();
    td.innerHTML= "b";
    
    td = tr.insertCell();
    td.innerHTML= "c";
    
    td = tr.insertCell();
    td.innerHTML= "d";
    
    td = tr.insertCell();
    td.innerHTML= "e";
 }
</script>
<body>
    <table id="table1" border="1" cellpadding="0" cellspacing="0" width="100%">
        <tr id="row1">
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
        </tr>
    </table>
    <input type="button" onClick="addNewRow()" value="Add New"/>
</body>

此示例用于在表格中动态插入新行和单元格。 但它在所有浏览器中的行为都不同。

  1. Internet Explorer = 它在最后添加行,新添加的单元格从第一个开始。

  2. Chrome/Safari = 它在第一行添加新行,新添加的单元格从末尾开始。

  3. Mozilla Firefox = 它不工作。

    我希望新添加的行在最后,新添加的单元格从第一个开始,就像所有浏览器中的 (Internet Explorer)。

如果您对相同的行为有任何解决方案,请告诉我。

最佳答案

尝试使用:

var tr = table.insertRow(-1);

就像这里所说的:

https://developer.mozilla.org/en/DOM/table.insertRow

关于javascript - 在表中动态插入新行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3051312/

相关文章:

javascript - 打开 document.windows,打印它并关闭它(不关闭)

mysql - INSERT INTO 仅当不存在时 MYSQL

php - 向表插入数据时遇到问题。代码点火器

Mysql插入2个表

java - 如何使用父标记对象查找内部子标记名列表

javascript - 从对象数组添加标记

javascript - 如何使除某些部分外的整个页面变黑?

html - CSS : page-break-inside: avoid doesn't work in table row

jquery - IE 8 - 慢速点击事件识别 - 100 个可点击的表格单元格

javascript - 使用 javascript 读取文本框用户输入并插入超链接