Javascript Vanilla - 如何在 ajax 内容中的元素上附加事件侦听器?



如果在 Jquery 中,我们可以简单地将事件委托给<body>,如下所示:

$('body').on('click', 'a[data-method]', function () {
// event action here
});

但是我们如何在Vanilla Javascript中做到这一点呢?

注意:<a data-method="">是在 ajax 内容中创建

的谢谢。

您可以将事件侦听器添加到body,然后检查event.target.matches所需的选择器:

document.body.addEventListener('click', (event) => {
if (!event.target.matches('a[data-method]')) return;
console.log('click');
});
setTimeout(() => {
const a = document.body.appendChild(document.createElement('a'));
a.setAttribute('data-method', 'foo');
a.textContent = 'aaa';
}, 100);

最新更新