javascript如何处理兼容问题？

IE9之前不兼容addEventListener（），但是可以使用attachEvent。
我该如何在一段代码中同时出现他们，就像css中-webkit-、-o-那样，不相关的浏览器直接忽略掉？
是不是要判断一下？如何判断呢？还有别的办法吗？

<div id=x style='width:200px;height:200px;background:red;'>
</div>
<p id=demo></p>
<script>
document.addEventListener('click',x1)
                          
function x1(){document.getElementById('demo').innerHTML='123';}
</script>

<div id=x style='width:200px;height:200px;background:red;'>
</div>
<p id=demo></p>
<script>
document.attachEventListener('mouseover',x1,true)
                          
function x1(){document.getElementById('demo').innerHTML='123';}
</script>

http://caniuse.com/

if(document.attachEvent) {
    document.attachEvent(...);
} else {
    document.addEventListener(...);
}

楼主，如果用原生js，可以像下面这么写，推荐你看下“javascript高级程序设计”这本书，里面讲的很通俗易懂哦

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>Document</title>

</head>
<body>


var oX = document.getElementById('x');
var oDemo = document.getElementById('demo');
var eventUil = {
  addHandler:function(obj,type,fn){
    if(obj.addEventListener){
      obj.addEventListener(type,fn,false);
    }else if(obj.attachEvent){
      obj.attachEvent("on"+type,fn);
    }else{
      obj["on"+type] = fn;
    }
  },
  removeHandler:function(obj,type,fn){
    if(obj.removeEventListener){
      obj.removeEventListener(type,fn,false);
    }else if(obj.deattachEvent){
      obj.detachEvent("on"+type,fn);
    }else{
      obj["on"+type] = null;
    }
  }

}

function x1()
{
    document.getElementById('demo').innerHTML='123';
}

eventUil.addHandler(oX,'click',x1);

</script>

</body>
</html>

【热门文章】