JS轻松获取对象之srcElement与target篇
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS轻松获取对象之srcElement与target篇相关的知识,希望对你有一定的参考价值。
参考技术A 开发中,当执行一个事件时需要去知道触发这个事件的对象是谁?那么,如何获取,在这里我就对 event.srcElement与event.target 操作获取略作区分 。event.srcElement: 表示可以获取当前作用事件的对象。
event.target: 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
兼容性:
event.target: Ie9+ 火狐、谷歌;
event.srcElement:ie 678;
srcElement 是 IE 下的属性
target 是 Firefox 下的属性
Chrome 浏览器同时有这两个属性
一、利用event.srcElement 获取标签:
event.srcElement.tagName :因为它获取出来的都是以 大写 的形式,例如(“A”,“DIV”)所以需要转换 obj.tagName.toLowerCase()="a"
二、 利用event.srcElement 获取子对象:
第一个子标签 :event.srcElement.firstChild;
最后个一个是: event.srcElement.lastChild;
第几个孩子: event.srcElement.children[i];
所有孩子: event.srcElement.children;
所有孩子节点: event.srcElement.childNodes;
三、利用event.srcElement 获取父对象:
.event.srcElement.parentElement; 可以理解成是在鼠标所在对象的上一个对象。
四、vent.target的 判断使用
js中事件是会泡的,event.target它永远是直接接受事件的目标DOM元素
一般是获取这个对象的id,兼容的写法如下:
var targetId = event.target ? event.target.id : event.srcElement.id;
获取id后再拿到事件中去判断。
谢谢观读~
��
事件获取目标 currentTarget target srcElement三者之间的区别和联系
currentTarget 指的是触发事件的当前对象,可以是冒泡和捕获的对象,不一定是点击或者鼠标移入等事件的直接触发对象。可以是他的父元素等。
target 指的是事件触发的直接对象。IE有兼容问题。
srcElement 和target相同,firFox不兼容。
获取直接目标对象的兼容写法 var target = e.target || e.srcElement
以上是关于JS轻松获取对象之srcElement与target篇的主要内容,如果未能解决你的问题,请参考以下文章
事件对象event之e.targtet || e.srcElement
onclick事件,无法获取js事件源对象,财富不多,希望高手帮忙看看,给些建议,谢谢~
事件获取目标 currentTarget target srcElement三者之间的区别和联系