在表中动态插入新行答案

【问题标题】：Dynamically insert new rows in the table在表中动态插入新行
【发布时间】：2017-06-04 05:54:43
【问题描述】：

<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>

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

Internet Explorer = 它在最后添加行，新添加的单元格从第一个开始。
Chrome/Safari = 它在第一个添加新行，新添加的单元格从末尾开始。
Mozilla Firefox = 它不工作。

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

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

【问题讨论】：

到目前为止，Stonedecroze 的回答是最正确的。您可能会花费数周时间来尝试让它在 3 或 4 个浏览器上运行。或者你可以点击超链接并在几分钟内运行一个 jQuery 版本——更好地保证它可以在尽可能多的浏览器上运行。
您可能会发现这很有用：[stackoverflow.com/questions/171027/add-table-row-in-jquery][1] [1]: stackoverflow.com/questions/171027/add-table-row-in-jquery

标签： javascript insert html-table row cells

【解决方案1】：

尝试使用：

var tr = table.insertRow(-1);

就像这里所说的：

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

【讨论】：