Javascript 如何避免在使用DOM添加和删除html表行时删除第一行？

下面的提琴来自另一个问题。它包含使用javascript动态添加和删除html表行的输出。小提琴里的密码给了我想要的。但我对代码有一个问题。在逐个删除行的同时，第一行也将被删除。如何仅在第一行中隐藏“删除”按钮

HTML

---

上面是小提琴中的代码。如果你不能加载小提琴，希望这对你有帮助。有时会发生这种情况。

只需添加以下语句：

x.rows[1].cells[3].children[0].style.display = x.rows.length > 2 ? '' : 'none';

这将获取对第三个单元格第一行中的

input

元素的引用，如果只有一行，则将其隐藏

更新的小提琴：

这看起来很优雅

隐藏第一个：

$("table tr:eq(1) td:eq(3) input").css("display","none");

然后显示新创建的tr：

var noRows = $("#POITable tr").length-1;
$("table tr:eq("+noRows+") td:eq(3) input").css("display","block");

小提琴：

---

只需在脚本中添加以下行

    new_row.cells[3].getElementsByTagName('input')[0].removeAttribute('style');

再加上HTML中的一点修改（在第一个删除按钮中将disabled添加为true）

---

Check fiddle:

您应该使用jquery（remove函数非常容易使用），还应该为每一行设置一个id号。这样你就可以告诉你的js代码不要删除id为1的行。我投票只是为了细节、演示和清洁。我认为这些问题本身也不错。只需将其添加到两个函数中，

insRow

和

deleteRow

。您还必须在

deleteRow

中获取对表

x

的引用。至少我是这样理解你想做什么的。如果不是这样，你必须澄清你的问题。编辑：我更新了它，因为我忘记了标题行。如果你把你的表格分成一个

thead

和

tbody

部分，你可以让它更干净一点（依我看）。我试过你说的，但似乎不起作用。让我更具体一点。在上面的提琴中，输出显示了表行的动态添加和删除。由于删除按钮显示在第一行中，因此可以完全删除表格，但表头的表格除外。因此，为了限制用户删除第一行，我想在第一行隐藏删除按钮。非常感谢您的所有努力和时间。它起作用了……但我有一个问题，那就是一旦我添加了一些行并删除了所有行，删除按钮就会进入第一行（它也会删除动态添加行中的所有删除按钮..但我希望删除按钮仅隐藏在第一行中非常感谢您的努力+1..小提琴的链接在哪里？非常感谢saratis:）它与crisp一起工作…非常感谢您的帮助@感谢您的努力+1，但我甚至不希望禁用的图像可见，并且在该空间中应为空白：(

var noRows = $("#POITable tr").length-1;
$("table tr:eq("+noRows+") td:eq(3) input").css("display","block");

    new_row.cells[3].getElementsByTagName('input')[0].removeAttribute('style');

   <td><input type="button" id="delPOIbutton" value="Delete" onclick="deleteRow(this)" style="display:none"/></td>