在PUG中为bootstrap表中的每个记录添加一个delete按钮

在PUG中为Bootstrap表中的每个记录添加一个delete按钮，可以通过以下步骤完成：

1. 首先，确保已在项目中安装并使用了Bootstrap和PUG（之前称为Jade）。
2. 在PUG模板中，使用循环遍历来生成表格的每一行，每行都包含一个删除按钮。可以使用PUG的循环语法和Bootstrap的表格类来实现。
3. 在PUG模板中添加以下代码：

table.table.table-striped
  thead
    tr
      th Name
      th Delete
  tbody
    each record in records
      tr
        td= record.name
        td
          button.btn.btn-danger.delete-button(type='button', onclick='deleteRecord("' + record.id + '")') Delete

解释以上代码：

• 首先，创建一个具有Bootstrap样式的表格，并添加一个thead元素和tbody元素。
• 在thead中创建表头行，并添加两个th元素：一个用于名称（Name），另一个用于删除（Delete）。
• 在tbody中使用each循环遍历每个记录，并创建一个表格行。
• 在每一行中，使用td元素显示记录的名称（record.name）。
• 同时，创建一个td元素用于删除按钮，使用button元素和Bootstrap的按钮类来实现。添加一个自定义的delete-button类和一个onclick事件处理函数来实现删除记录的功能。其中，onclick事件调用了一个名为deleteRecord的JavaScript函数，传递了记录的id作为参数。

1. 在JavaScript文件中添加以下代码来实现deleteRecord函数：

function deleteRecord(recordId) {
  // 在这里添加删除记录的逻辑
  console.log('Delete record with ID:', recordId);
}

这里只是简单地在控制台打印了删除记录的ID，你可以根据实际需求来实现删除记录的逻辑。

通过以上步骤，你就可以在PUG模板中为Bootstrap表中的每个记录添加一个delete按钮了。记得根据实际需求来替换代码中的record.name和record.id，并根据具体情况实现删除记录的逻辑。