appendChild之后的addEventListener [英] addEventListener after appendChild

问题描述

我用 document.createElement 等创建一个元素 eltTooltip 并将其添加到DOM中，如下所示（ idTooltip 包含 eltTooltip 的 id ）：

I create an element, eltTooltip, with document.createElement etc and add it to the DOM like this (idTooltip contains the id of eltTooltip):

document.body.appendChild(eltTooltip);
var addedElt = document.getElementById(idTooltip);
addedElt.addEventListener("click", function(){...});

是否肯定会添加 click 事件

我能以更好的方式做到这一点吗？ （该页面很早以前就已加载，因此 window.onload 不能使用。在这里我不能使用jQuery。）

Could I do this in a better way? (The page is loaded long ago so window.onload can not be used. And I can't use jQuery here.)

推荐答案

您的方法工作得很好，但是在使用 eltTooltip 将事件侦听器添加到DOM之前，最好附加它。 。这样可以避免您从DOM中获取元素。

Your way works perfectly fine but it's probably better to attach the event listener before you add it to the DOM using eltTooltip. This saves you from fetching the element from the DOM.

演示

var idTooltip = 'test';
var eltTooltip = document.createElement('div');
eltTooltip.innerHTML = "test"
eltTooltip.setAttribute('id', idTooltip);
eltTooltip.addEventListener("click", function () {
    alert('click');
});

document.body.appendChild(eltTooltip);

这篇关于appendChild之后的addEventListener的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！