21-jq事件中的this和event.target

发表于 | 分类于 |

codepen

jq中this和event.target的区别：

　　1.js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远指向触发事件的DOM元素本身；

　　2.this和event.target都是dom对象，使用jQuey中的方法可以将他们转换为jquery对象：$(this)和$(event.target). 　　 　　

event.target表示发生点击事件的元素；

this表示的是注册点击事件的元素。

有些时候 event.target 与 this 相等，即$(this) =$(event.target)

1 不代理事件时

不代理事件时，当前 谁注册了事件,this就指向谁

1
2
3
4
$("body").on("click",function(e){
  console.log(e.target)
  console.log($(this))
})

image

2 代理事件时

代理事件时，e.target == this

1
2
3
4
$("body").on("click",".a",function(e){
  console.log(e.target)
  console.log($(this))
})

image