在动态元素上点击事件没有jQuery

Question

我想添加一个事件，如onclick或mouseover到一个动态创建的元素（类似于jQuery中的.live函数）......我如何在没有框架的情况下使用纯JavaScript如jQuery？这里是一个简单的jsFiddle http://jsfiddle.net/3tBpv/1/

我想能够做到这一点从新创建的div类而不是一个id。

任何帮助，将不胜感激

Answer 1

创建文档对象上一个处理程序。检查目标元素的类和节点名称（标记）。如果它们匹配，继续执行任何需要的操作，否则忽略点击。

document.onclick = function(event) { 
    var el = event.target; 
    if (el.className == "new" && el.nodeName == "DIV") { 
     alert("div.new clicked"); 
    } 
}; 

这是fiddle。

Answer 2

@Anurag's answer是正确的，但不完整，在大多数情况下会导致大量的集成bug。

这里是正确的版本：

document.addEventListener("click", function(event) 
{ 
    // retrieve an event if it was called manually 
    event = event || window.event; 

    // retrieve the related element 
    var el = event.target || event.srcElement; 

    // for all A tags do the following 
    if (el instanceof HTMLAnchorElement) 
    { 
     //required to make the "return false" to affect 
     event.preventDefault(); 

     window.location.href = "/click.php?href="+encodeURIComponent(el.href); 

     //prevent user's click action 
     return false; 
    } 
}, true); 

这是一个基本的点击追踪功能会影响页面上的所有链接跟踪/记录的所有链接的点击次数。