添加事件和事件对象
-
元素.on事件名
-
注意：
- 事件不可绑定多个，后面绑定的会覆盖前面的
-
格式：
let oBtn=document.querySelector("button"); oBtn.onclick=function () { alert(123); }
-
addEventListener -
注意：
- IE9以上才可使用
- 事件不加on
- 事件可绑定多个
-
格式：
let oBtn=document.querySelector("button"); oBtn.addEventListener("click", function () { alert(123); })
-
attachEvent -
注意：
- IE9以下才可使用
- 事件可绑定多个，后绑定的先执行
-
格式：
let oBtn=document.querySelector("button"); oBtn.attachEvent("onclick",function () { alert(123); });
-
兼容写法：
//addEvent(元素,事件名,回调函数) function addEvent(ele, name, fn) { if (ele.addEventListener) { ele.addEventListener(name, fn); } else { ele.attachEvent("on" + name, fn); } }
-
事件对象
兼容写法：
event = event || window.event-
格式：
<a href="http://www.baidu.com">123</a> <script> var oA = document.querySelector("a"); oA.onclick = function (event) { //事件对象兼容写法 event = event || window.event; console.log(event); //阻止默认行为 return false; //企业推荐 //event.preventDefault(); //高级浏览器 //event.returnValue = false; //IE9以下浏览器 } </script>
