jQuery each怎样处理动态生成的元素

要使用 jQuery 的 each 函数处理动态生成的元素，您需要确保在动态生成的元素添加到 DOM 之后执行该函数。您可以使用事件委托（event delegation）来实现这一点。事件委托是将事件监听器添加到父元素上，而不是直接添加到目标元素上。当事件触发时，jQuery 会检查事件源是否匹配选择器，如果匹配，则执行相应的回调函数。

以下是一个使用 jQuery 处理动态生成的元素的示例：

HTML 结构：

<div id="container">
  <button class="dynamic-button">Click me</button>
</div>

JavaScript/jQuery 代码：

$(document).ready(function() {
  // 给动态生成的按钮添加点击事件
  $("#container").on("click", ".dynamic-button", function() {
    alert("Button clicked: " + $(this).text());
  });

  // 动态添加新的按钮
  function addNewButton() {
    var newButton = $("<button>").addClass("dynamic-button").text("New button");
    $("#container").append(newButton);
  }

  // 每隔一秒钟添加一个新的按钮
  setInterval(addNewButton, 1000);
});

在这个示例中，我们将点击事件监听器添加到了 #container 元素上，而不是直接添加到 .dynamic-button 元素上。当点击事件触发时，jQuery 会检查事件源是否匹配 .dynamic-button 选择器。如果匹配，则执行相应的回调函数。这样，无论何时添加新的 .dynamic-button 元素，点击事件都会被正确处理。