首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何向列表中添加的每个li元素添加一个删除按钮?

要向列表中的每个li元素添加一个删除按钮,可以通过以下步骤实现:

  1. 首先,获取到所有的li元素。可以使用JavaScript的querySelectorAll方法来选择所有的li元素,例如:
代码语言:txt
复制
var liElements = document.querySelectorAll('li');
  1. 接下来,使用一个循环遍历所有的li元素,并为每个li元素创建一个删除按钮。可以使用createElement方法创建一个新的按钮元素,并使用appendChild方法将其添加到每个li元素中,例如:
代码语言:txt
复制
liElements.forEach(function(li) {
  var deleteButton = document.createElement('button');
  deleteButton.textContent = '删除';
  li.appendChild(deleteButton);
});
  1. 最后,为每个删除按钮添加一个点击事件监听器,以便在点击按钮时删除相应的li元素。可以使用addEventListener方法为每个按钮添加一个点击事件监听器,例如:
代码语言:txt
复制
liElements.forEach(function(li) {
  var deleteButton = document.createElement('button');
  deleteButton.textContent = '删除';
  li.appendChild(deleteButton);
  
  deleteButton.addEventListener('click', function() {
    li.remove();
  });
});

通过以上步骤,你可以向列表中的每个li元素添加一个删除按钮,并在点击按钮时删除相应的li元素。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券