用js给div绑定事件，实现点击切换效果的几种方式总结

用js给div绑定事件，实现点击切换效果，总结有如下几种方式

script type="text/javascript">  function btnAction()  { var titleNValue = document.getElementById("titleN").value;var complaintValue =  document.getElementById("complaint").value;if(titleNValue==""){alert("标题不能为空!");return false;}if(complaintValue==""){alert("内容不能为空!");return false;}  }    function $(obj){      return document.getElementById(obj);  }  function change(n){      for (var i=1;i<3;i++){          if(n==i){              /* $("a"+i).style.zIndex="100"; */              $("a"+i).style.background ="red";          }else{             /*  $("a"+i).style.zIndex="0"; */              $("a"+i).style.background ="#ddd";          }      }  }//addEventListener 是JS自带函数  // attachEvent 是JS自带函数  /* var EventUtil = new Object;  EventUtil.addEventHandler = function (oTarget, sEventType, fnHandler) {      if (oTarget.addEventListener) { // 如果还没有绑定click事件，则进行绑定。页面载入时候会执行这里。          oTarget.addEventListener(sEventType, fnHandler, false);      } else if (oTarget.attachEvent) { // 查看绑定了什么事件          oTarget.attachEvent("on" + sEventType, fnHandler);      } else {          oTarget["on" + sEventType] = fnHandler;      }  };  EventUtil.removeEventHandler = function (oTarget, sEventType, fnHandler) {      if (oTarget.removeEventListener) {          oTarget.removeEventListener(sEventType, fnHandler, false);      } else if (oTarget.detachEvent) {          oTarget.detachEvent("on" + sEventType, fnHandler);      } else {          oTarget["on" + sEventType] = null;      }  };  // 最后起作用的函数  function handleClick() {     alert("Click!\nd");       var oDiv = document.getElementById("div1");      oDiv.style.background = '#ddd';            var oDiv2 = document.getElementById("div2");      oDiv2.style.background = 'red';     /*  oDiv.attr("style","background-color: red"); */      // EventUtil.removeEventHandler(oDiv, "click", handleClick); // }  // 绑定DIV与触发事件，以及函数体  /*  window.onload = function() {       var oDiv = document.getElementById("div1");      EventUtil.addEventHandler(oDiv, "click", handleClick);             var Div = document.getElementById("div2");      EventUtil.addEventHandler(Div, "click", handleClick);   }   */   /*另一个绑定事件*/      function div1(){        var mydiv2 = document.getElementById('div2');        mydiv2.style.background = 'white';        var mydiv1 = document.getElementById('div1');        mydiv1.style.background = 'red';      /*    var div2 = document.getElementById('div2');        if(typeof ActiveXObject !='undefined'){//ie            var myevent = document.createEventObject();            div2.fireEvent('onclick',myevent);//如果需要在onclick中使用myevent的某些属性，得另外添加        }else{//chrome,ff等            var myevent = document.createEvent('MouseEvents');            myevent.initEvent('click',true,true,document.defaultView,0,0,0,0,0,false,false,false,false,0,null);            div2.dispatchEvent(myevent);       }  */    }    function div2(){        var mydiv2 = document.getElementById('div2');        mydiv2.style.background = 'red';        var mydiv1 = document.getElementById('div1');        mydiv1.style.background = 'white';    }  </script>