javascript - 如何将 jQuery 转换为 JavaScript name 属性

Question

我正在尝试找到一种方法来为 JS 中动态生成的按钮创建“点击”事件。我知道在 jQuery 中可以这样做:

$(document).on('click', 'name=[buttonName]', function() {}); 

我知道 JS 中的 e.target 方法，但我想找到一种方法来使用 name 属性来代替它。

谢谢

Answer 1

首先，这行 jQuery 不太正确，因为方括号在错误的位置:

$(document).on('click', '[name="buttonName"]', func); 

要在纯 JS 中实现相同的效果，您需要将点击事件处理程序附加到静态父元素，然后检查被点击元素的 name 属性:

document.addEventListener('click', function(e) {
  if (e.target.name == 'buttonName') {
    // do something...
  }
});

document.addEventListener('click', function(e) {
  if (e.target.name == 'buttonName') {
    alert('Hello!');
  }
});

<button>I do nothing!</button>
<button name="buttonName">I say hello!</button>