js中event.srcElement和event.target的区别

Javascript event.srcElement

event.srcElement 可以捕获当前事件作用的对象,如event.srcElement.tagName可以捕获活动标记名称。
注意获取的标记都以大写表示,如"TD","TR","A"等。

例如:alert(oEvent.srcElement.tagName)   //结果为 SELECT

 //测试得出通过oEvent.srcElement获得的tagName全是大写的,但是,一般的标签名,都是小写的,所以,常用toLowerCase()方法变小写.

重点概念:

event.srcElement从字面上可以看出来有以下关键字:事件,源     他的意思就是:当前事件的源,相当于jq的$(this)事件,直接获得事件源,就是你产生事件的源;

兼容性:

IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的;FF下语法为:event.target


测试来:

<body> 
    <div id="div_001">
        <form name="form_al">
            <input name="textname" type="text" value="ss"/>
            <select name="selectname" >
                <option value="苹果">苹果</option>
                <option value="香蕉">香蕉</option>
                <option value="西瓜">西瓜</option>
                <option value="橘子">橘子</option>
                <option value="土豆">土豆</option>
            </select>
        <form>
    </div>
    <script>
        document.form_al.selectname.οnchange=function(ev){
            var oEvent=ev||window.event;
            /*alert(oEvent.srcElement.tagName);*/  //测试得出通过oEvent.srcElement获得的tagName全是大写的,但是,一般的标签名,都是小写的,所以,常用toLowerCase()方法变小写.
            oEvent.srcElement?document.form_al.textname.value=oEvent.srcElement.options[oEvent.srcElement.selectedIndex].text:document.form_al.textname.value=oEvent.target.options[oEvent.target.selectedIndex].text;
        }
    </script>
</body>


这两个方法下面有如下属性:

event.srcElement.id 

event.srcElement.tagname  //得到响应源的“标签名”
event.srcElement.type  //“类型”
event.srcElement.value  //针对表单元素的“值”
event.srcElement.name  //针对表单元素的“name”属性
event.srcElement.classname 
event.srcElement.parentElement  //“父级元素”
event.srcElement.getattribute  //“获得属性”,setattribute 为"设置属性"
event.srcElement.children 
event.srcElement.lastChild 
event.srcElement.ChildNode  //"子节点"
event.srcElement.selectedIndex 

总之 常用的也就 event.srcElement.value ..得到钱标记的各种属性值 
event.srcElement.parentElement.各属性 
event.srcElement.各标签属性 
event.srcElement.parentNode 上一节点
  


  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值