避免使用嵌套ul/li的双重事件(onclick)

<ul id="parentList">
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
</ul>

<script>
  document.getElementById("parentList").addEventListener("click", function(event) {
    if (event.target.tagName === "LI") {
      // 处理点击事件
    }
  });
</script>

<ul>
  <li onclick="handleClick(event)">列表项1</li>
  <li onclick="handleClick(event)">列表项2</li>
  <li onclick="handleClick(event)">列表项3</li>
</ul>

<script>
  function handleClick(event) {
    var target = event.target;
    // 处理点击事件
  }
</script>

<ul>
  <li data-id="1" onclick="handleClick(event)">列表项1</li>
  <li data-id="2" onclick="handleClick(event)">列表项2</li>
  <li data-id="3" onclick="handleClick(event)">列表项3</li>
</ul>

<script>
  function handleClick(event) {
    var target = event.target;
    var id = target.dataset.id;
    // 处理点击事件
  }
</script>