如何獲得div或錨點標識的id，單擊時，使用純javascript

Question

我想單擊它可以獲得<div>或<a>的ID。請幫助...

<div class="reccl" id="allact"><a href="#" class="a" id="b">All Activities</a></div> 
<div class="reccl" id="lgns"><a href="#" class="a" id="bb">Logins</a></div> 
<div class="reccl" id="dwld"><a href="#" class="a" id="bb">Download</a></div> 

javascript代碼：

var a = document.getElementsByClassName('a'); 
    for(var b = 0; b <= a.length; b++){ 
     a[i].onclick = function(e){ 
      alert("id clicked"); 
     } 
    } 

代碼在這裏：http://jsfiddle:%20http://jsfiddle.net/mm07p5rz/

Answer 1

剛剛獲得click事件的target對象的id財產。順便說一句，id s應該在文檔中是唯一的。

這將讓任何元素的id點擊頁面上：

document.addEventListener("click", function(evt){ 
 
    console.log(evt.target.id); 
 
});

<div class="reccl" id="allact"><a href="#" class="a" id="b">All Activities</a></div> 
 
<div class="reccl" id="lgns"><a href="#" class="a" id="bb">Logins</a></div> 
 
<div class="reccl" id="dwld"><a href="#" class="a" id="bbb">Download</a></div>

這將讓被點擊任何<a>元素的id。您可以過濾特定的元素，你喜歡的任何方式，但這一進程，以獲得id是一樣的：

// Get just and <a> elements 
 
var anchors = document.querySelectorAll("a"); 
 

 
// Set up a click event listener for each one 
 
for(var i = 0; i < anchors.length; i++){ 
 
    anchors[i].addEventListener("click", function(evt){ 
 
    console.log(evt.target.id); 
 
    }); 
 
}

<div class="reccl" id="allact"><a href="#" class="a" id="b">All Activities</a></div> 
 
<div class="reccl" id="lgns"><a href="#" class="a" id="bb">Logins</a></div> 
 
<div class="reccl" id="dwld"><a href="#" class="a" id="bbb">Download</a></div>

Answer 2

我編輯源代碼

var a = document.getElementsByClassName('reccl'); 
 
for (var b = 0; b < a.length; b++) { 
 
a[b].onclick = function(e){ 
 
    //get child's id in element 
 
    alert(e.target.id); 
 
    
 
    //get element's id 
 
    alert(e.currentTarget.id); 
 
} 
 
}

<div class="reccl" id="allact"><a href="#" class="a" id="b">All Activities</a></div> 
 
<div class="reccl" id="lgns"><a href="#" class="a" id="bb">Logins</a></div> 
 
<div class="reccl" id="dwld"><a href="#" class="a" id="bb">Download</a></div>