Question

我有一个包含其他div的div：

<div id="main_div">

  <div id="div_1">
    <div id="some_id"></div>
  </div>

  <div id="div_2">
    <div id="some_id"></div>
  </div>

  <div id="div_3">
    <div id="some_id"></div>
  </div>

</div>

如何在单击特定div时以编程方式获取下一个div id？

div_1 is clicked -> alert div_2
div_2 is clicked -> alert div_3

由于

Answer 1

如果你可以使用jQuery，你应该这样做。使用next函数

$("#main_div > div").on("click", function(){
  alert($(this).next("div").attr("id"));
});

Answer 2

您可以使用Node.nextSibling

在父节点的childNodes列表中返回紧跟在指定节点之后的节点，如果指定节点是该列表中的最后一个节点，则返回null。

Answer 3

var div = document.getElementById('main_div');

for (var i=0, len=div.children.length; i<len; i++) {
    div.children[i].addEventListener('click', function(e) {
        var nextSib = e.target.nextSibling;

        if (nextSib) alert(nextSib.id);
    }, false);
}

获得div儿童ID

3 个答案: