「js」点击事件的3种实现与事件覆盖

1.行内绑定点击事件

点我呀

该方法只能绑定一个处理函数。

2.onclick绑定点击事件

    
点我呀
    
点我呀
    
点我呀

    var elements = document.getElementsByClassName("hello");
    var len = elements.length;
    for(var i=0; i

运行结果，点击div时，只执行了第二次绑定的onclick函数体里的内容，并能正确的打印出对应的DOM结点。

由此可见：onclick绑定点击事件，后绑定的会覆盖先绑定的事件处理，最后绑定的事件生效。

3.addEventListener绑定点击事件

    
点我呀
    
点我呀
    
点我呀

    var elements = document.getElementsByClassName("hello");
    var len = elements.length;
    for(var i=0; i

运行结果，点击div时，两次绑定的click事件都执行了，能正确的打印出对应的DOM结点。

由此可见：addEventListener绑定点击事件，可以实现对同一元素绑定多个事件。