美文网首页
target、this、currentTarget区别

target、this、currentTarget区别

作者: DecadeHeart | 来源:发表于2017-03-25 10:16 被阅读0次

    重点理论
    1.target:触发事件的某个具体对象,只会出现在事件流的目标阶段,谁触发谁命中
    2.currentTarget:绑定事件的对象,恒等于this,可能出现在事件流的任意一个阶段中
    3.通常情况下target和currentTarget是一致的,我们只要使用target即可,但是有一种情况,必须区分三者之间的关系
    父子嵌套关系中,父元素绑定了事件,然而单击子元素触发事件,则根据事件流,在布阻止事件流的前提下他会传递至父元素,因为他是绑定事件的对象,而target由于是触发事件的具体对象,它会指向子元素

    <div id="one">
    <div id="three"></div>
    </div>
    one.addEventListener('click',function(e){
    console.log(e.target); //three
    console.log(e.currentTarget); //one
    },false);

    function delBtnHandle() {
    //通过当前元素父节点的父节点的第一个子节点的文本内容确定当前数组的属性并删除
    //这里不能用e,要用this来指代对象
    var cityName = this.target.parentNode.parentNode.childNodes[0].innerHTML;
    delete aqiData[cityName];
    renderAqiList();
    }

    相关文章

      网友评论

          本文标题:target、this、currentTarget区别

          本文链接:https://www.haomeiwen.com/subject/quzqottx.html