具有未知选择器和子项的 Javascript 事件委托

事件委托是一种在 JavaScript 中处理事件的有效方式，它允许你将事件处理程序添加到父元素上，而不是为每个子元素单独添加处理程序。这样可以提高性能，特别是当你有大量子元素时。

要使用事件委托，你需要选择一个父元素作为事件的目标。当事件在父元素上触发时，事件会冒泡到父元素，然后你可以在父元素上处理事件。

以下是一个简单的示例，演示如何使用事件委托来处理点击事件：

// 获取父元素
const parent = document.getElementById('parent');

// 添加点击事件处理程序
parent.addEventListener('click', function(event) {
  // 获取点击的子元素
  const target = event.target;

  // 检查子元素是否是你想要处理的元素
  if (target.classList.contains('child')) {
    // 处理点击事件
    console.log('点击了子元素');
  }
});

在上述示例中，我们首先获取了一个父元素 parent。然后，我们使用 addEventListener 方法为父元素添加了一个点击事件处理程序。当点击事件在父元素上触发时，事件会冒泡到父元素，然后我们可以在事件处理程序中处理事件。

在事件处理程序中，我们首先使用 event.target 获取了点击的子元素。然后，我们使用 classList.contains 方法检查子元素是否是我们想要处理的元素。如果是，我们就可以在事件处理程序中处理点击事件。

请注意，事件委托只适用于冒泡事件，例如点击事件、鼠标移动事件等。对于不冒泡的事件，例如表单提交事件，你需要为每个子元素单独添加处理程序。