dom对象中的this和event.target区别

来源：互联网发布：私募模拟交易系统源码编辑：程序博客网时间：2024/06/01 10:27

dom对象中的this和event.target区别

1.this是事件冒泡，动态变化。先触发内部事件，由内到外的执行。

<script>    function testdiv(val){        console.log(val.id);    }     function testa(val){        console.log(val.id);    }    </script>    <body>        <div onclick="testdiv(this)" id="testdiv">            <a href="#" onclick="testa(this)" id="testa">click me</a>        </div>    </body>

运行结果
这里写图片描述

2.event.target代表的是触发事件的dom对象，是静态不变的。

<script>    function testdiv(){        console.log(event.target.nodeName);    }     function testa(){        console.log(event.target.nodeName);    }    function testbody(){        console.log(event.target.nodeName);    }    </script>    <body onclick="testbody()">        <div onclick="testdiv()" id="testdiv">            <a href="#" onclick="testa()" id="testa">click me</a>        </div>    </body>

运行结果
这里写图片描述
总结：
即便在父元素事件里面，event.target仍然是指具体的子对象，而用this取到的就是父元素。
两者都代表dom对象，如果需要调用jquery的方法可以这样(this),(event.target)。

阅读全文

1 0