currentTarget 定義和用法
currentTarget 事件屬性返回其監聽器觸發事件的節點,即當前處理該事件的元素、文檔或窗口。
在捕獲和起泡階段,該屬性是非常有用的,因爲在這兩個節點,它不同於 target 屬性。
語法:event.currentTarget
<html>
<head>
<script type="text/javascript">
function getEventTrigger(event)
{
x=event.currentTarget;
alert("The id of the triggered element: "
+ x.id);
}
</script>
</head>
<body >
<p id="p1" onmousedown="getEventTrigger(event)">
Click on this paragraph. An alert box will
show which element triggered the event.</p>
</body>
</html>
target定義和用法
target 事件屬性可返回事件的目標節點(觸發該事件的節點),如生成事件的元素、文檔或窗口。
語法:event.target
區別:
當沒有事件委託的時候,currenttarge和target指的時同一個元素,如上面的案例
當有事件委託的時候,currenttarget一般指的是委託事件的元素,大多數時父元素,而目標元素是子元素
$(document).ready(function(){
$("div").on("click","button",function(event){
console.log("currenttarget: "+JSON.stringify(event));
console.log("target: "+event.target)
$(event.delegateTarget).css("background-color", "pink");
});
});
上面的例子:'div’是currenttarget,'button’是target