封装一个方法给元素添加(删除)各种事件，同时兼容不同的浏览器。 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>给多个元素添加(注册)事件</title>
</head>
<body>
<p id="p1" style="background-color:yellow" >我是p1</p>
<p id="p2" style="background-color:red" >我是p2</p>

<script type="text/javascript">
    //给html中的多个元素添加(注册)事件，同时要考虑到各大浏览器的兼容性问题
    //下面就封装一个方法，给元素注册事件
var untils = new Object();
    untils.addEvent = function(element,eventName,fn){
        //事件注册兼容性问题
        //判断是哪个浏览器，如果是非IE浏览器就用addEventListener方法
        //如果是IE浏览器就用attachEvent方法
        if(document.addEventListener){
            element.addEventListener(eventName,fn,false);   //非IE标准
        }else{
            element.attachEvent("on"+eventName,fn);     //IE标准
        };
    };
var _p1 = document.getElementById("p1");
    untils.addEvent(_p1,"click",function(){
        alert("我是p1被点出来啦");
    });
    var _p2 = document.getElementById("p2");
    untils.addEvent(_p2,"click",function(){
        alert("我是p2被点出来啦");
    });

    //同理：删除事件就把untils.addEvent 改成untils.removeEvent
    //非IE浏览器就把addEventListener改成removeEventListener
    //IE浏览器就把attachEvent改成detachEvent
</script>
</body>
</html>

　　

posted on 2016-01-20 16:23  冬刻忆  阅读(170)  评论(0)    收藏  举报