使用按钮onClick删除li项

是一个前端开发的常见需求，可以通过JavaScript来实现。

首先，在HTML中定义一个按钮和一个包含li项的列表：

<button onclick="deleteListItem()">删除</button>
<ul id="list">
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
</ul>

然后，在JavaScript中编写一个函数来处理按钮点击事件，删除选中的li项：

function deleteListItem() {
  var list = document.getElementById("list");
  var selectedItems = list.getElementsByTagName("li");
  
  // 从后往前遍历选中的li项，以防删除后索引发生变化
  for (var i = selectedItems.length - 1; i >= 0; i--) {
    var item = selectedItems[i];
    item.parentNode.removeChild(item);
  }
}

这段代码首先通过getElementById获取到id为"list"的ul元素，然后通过getElementsByTagName获取到所有的li元素。接着使用for循环从后往前遍历选中的li项，并使用parentNode.removeChild方法将其从ul中移除。

这个功能可以应用在各种需要动态删除列表项的场景，比如待办事项列表、购物车列表等。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云前端开发相关产品：云开发
• 腾讯云后端开发相关产品：云函数
• 腾讯云数据库相关产品：云数据库 MySQL
• 腾讯云服务器运维相关产品：云服务器 CVM
• 腾讯云云原生相关产品：容器服务 TKE
• 腾讯云网络通信相关产品：私有网络 VPC
• 腾讯云网络安全相关产品：云安全中心
• 腾讯云音视频相关产品：云直播
• 腾讯云多媒体处理相关产品：云点播
• 腾讯云人工智能相关产品：智能图像
• 腾讯云物联网相关产品：物联网开发平台
• 腾讯云移动开发相关产品：移动推送
• 腾讯云存储相关产品：对象存储 COS
• 腾讯云区块链相关产品：区块链服务 BaaS
• 腾讯云元宇宙相关产品：腾讯云元宇宙