target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
在标准浏览器下我们一般使用event.target就能解决,然而低版本IE浏览器总是会出些幺蛾子,这时候就得使用event.srcElement。
这时候就得有一个兼容性的写法了。
1、使用三元运算符
var Target = event.target ? event.target : event.srcElement
2、使用if语句来判断
if(event.target){ // IE10及以下版本浏览器不能识别 // do something... }else if(event.srcElement){ // IE10及以下版本会执行该代码 // do something... }
例如:现在要为一个按钮添加一个监听事件,当点击该按钮时就触发事件,这时候可以这样写:
<button id="btn">按钮</button> <script> // tagName返回的标签名默认都是大写的,可使用toLowerCase将其转换为小写 var btn = document.getElementById('btn'); if(btn.attachEvent){ // IE8及以下版本写法 btn.attachEvent('onclick',function(ev){ // Firefox下必须给函数传一个参数,一般会传event或ev,否则会报错,其他浏览器可不传,为了兼容性,所以给函数传参以防出错。 var Target = ev.target ? ev.target : ev.srcElement; console.log(ev.type); // 事件类型 console.log(Target.tagName) // 触发该事件的标签名,为大写,不同的浏览器可能会返回不同的结果 }) }else if(btn.addEventListener){ // IE8及以下版本不支持 btn.addEventListener('click',function(ev){ // Firefox下必须给函数传一个参数,一般会传event或ev,否则会报错,其他浏览器可不传,为了兼容性,所以给函数传参以防出错。 var Target = ev.target ? ev.target : ev.srcElement; console.log(ev.type); console.log(Target.tagName) }) } </script>