完整代码如下

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style></style>
  </head>

  <body>
    <input type="text" class="textInput" />
    <button id="btn">添加</button>
    <ul class="list">
      <li class="li">吃饭</li>
      <li class="li">睡觉</li>
      <li class="li">打豆豆</li>
    </ul>
  </body>
  <script>
    // 点击添加的时候，输入框的里面的value添加到li.innneHTML里面
    var button = document.getElementById("btn");
    var input = document.querySelector("input");
    var li = document.querySelector("li");
    var ul = document.querySelector("ul");
    var inputValue = "";
    var arr = [];
    button.onclick = function () {
      // 创建一个li挂到ul上面
      li = document.createElement("li");
      ul.appendChild(li);
      if (input.value) {
        li.innerHTML = input.value;
        input.value = "";
      } else {
        alert("您还没有输入任何内容");
      }
    };
    //  当ul里面的东西被点击的时候，里面的元素会一个个的被移出
    ul.onclick = function (e) {
      e.currentTarget.removeChild(e.target);
    };
  </script>
</html>

用DOM添加点击事件和事件委托 移除节点e.currentTarget.removeChild（e.target）制作一个代办清单

完整代码如下

用DOM添加点击事件和事件委托移除节点e.currentTarget.removeChild（e.target）制作一个代办清单