获取页面中的元素数

Question

假设您有5个<divs> ，其中包含内容，但都包含一些内容。 所以就像：

<div class='module-class' id='module-1'>Hello world. <button class='delete'>X</button></div>
<div class='module-class' id='module-2'>Testing <button class='delete'>X</button></div>
<div class='module-class' id='module-3'>This is text <button class='delete'>X</button></div>
<div class='module-class' id='module-4'>Moon and Sun <button class='delete'>X</button></div>

假设您在具有“ This is text的<button>内单击。 所以，显然，它在页面第三。 这样您就可以返回“ Clicked on'module-3'`

你会怎么做？

Answer 1

$('.module-class').click(function(e){
    console.log("Clicked on '" + $(this).attr('id') + "'");
});

Answer 2

您也可以不使用jQuery。

(function() {
    try {
      var _divs = document.getElementsByTagName('div');
    } catch(e) {
      console.log("_divs returned undefined");
      return;
    }
    Array.prototype.forEach.call(_divs, function(el) {
        el.addEventListener('click', function() {
            console.log('div#' + this.id + ' was clicked');
        });
    });
})();

http://jsfiddle.net/V98kE/