当有多个相同的DIV时,我怎么判断我点击的是哪个 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>判断点击的是哪个div</title>
    <style>
    .node {
        width: 200px;
        height: 50px;
        line-height: 50px;
        background: #ed145b;
        margin-bottom: 10px;
        text-align: center;
        color: #fff;
        cursor: pointer;
    }
    </style>
</head>
<body>
    <div class="node">点我啊</div>
    <div class="node">点我啊</div>
    <div class="node">点我啊</div>
    <div class="node">点我啊</div>
    <div class="node">点我啊</div>
    <script>
    var oDiv = document.getElementsByClassName("node");
    for (var i = 0; i < oDiv.length; i++) {
        (function(i) {
            oDiv[i].onclick = function() {
                alert(i);
            }
        })(i)
    }
    </script>
</body>
</html>

使用一下js类库吧

上面的原生js固然可以实现功能，但是不够精简。而且很多时候，我们在工作中都会使用一些js类库，比如：jQuery，Zpeto（移动端使用）什么的。所以在此也贴上jQuery实现该功能的代码。

$('.node').on('click', function(e) {
    alert($(this).index());
});
这样一来代码便简洁了很多
posted @ 2017-11-23 11:39  ALLpick  阅读(2129)  评论(0)  编辑  收藏  举报