JavaScript event.currentTarget

admin發表於2018-10-31
JavaScript

currentTarget屬性返回當前處理該事件的元素，也就是正在執行的事件處理函式所在的元素。

此屬性與event.target類似，更多內容可以參閱如下兩篇文章：

（1）.JavaScript event.target一章節。

（2）.event.currentTarget與event.target區別一章節。

語法結構：

[JavaScript] 純文字檢視 複製程式碼
event.currentTarget

瀏覽器支援:

（1）.IE9+瀏覽器支援此屬性。

（2）.edge瀏覽器支援此屬性。

（3）.谷歌瀏覽器支援此屬性。

（4）.opera瀏覽器支援此屬性。

（5）.火狐瀏覽器支援此屬性。

（6）.safria瀏覽器支援此屬性。

程式碼例項:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title> 
<style type="text/css"> 
#ant{
  width:100px;
  height:60px;
  line-height:60px;
  text-align:center;
  background-color:#ccc;
}
</style> 
<script> 
window.onload=function(){ 
  let obox = document.getElementById("ant");
  obox.onclick = function (ev) {
    let currentTarget = event.currentTarget;
    obox.innerHTML=currentTarget.id;
  } 
} 
</script> 
</head> 
<body> 
<div id="ant"></div> 
</body> 
</html>

程式碼執行效果截圖如下：

a:3:{s:3:\"pic\";s:43:\"portal/201810/31/152940h8bk5u7vbz68v9tf.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

因為currentTarget屬性返回當前處理該事件的元素。

所以，點選div元素，可以將其id屬性值寫入其中。

相關文章