Question

我正在创建一个简单的java脚本供电图片拼图。到目前为止，我所做的是创建一个div作为父类，在div中，我创建了9个div元素来表示图片的每个部分（这是一个3x3拼图）。这是我用于图片元素div的CSS样式。

.part{
background-image: url(../images/image.jpg);
background-position: top left;
background-repeat: no-repeat;
box-shadow: 1px 1px 10px;
}

 #part{
width: 200px;
height: 200px;
float: left;
border: 1px dotted #fff;
}

我的概念是，如果用户点击div元素，脚本应检查相邻的div元素。如果元素没有分配背景图像，它应该获得被点击元素的值。

我的问题是，如何从用户点击的div中获取相邻div的元素id！

Answer 1

您可以使用dom对象的nextSibling属性访问相邻的div

Answer 2

我推荐Ankur的答案，但我必须告诉你，你必须非常小心nextSibling。看看以下标记：

<div id="Div1">Text1</div>
<div id="Div2">Text2</div>

在Chrome document.getElementById("Div1").nextSibling中，将返回ID为Div2的div。然而，在IE中，同一行返回一个#Text节点，引用两个div标记之间的空白。

要确保您获得下一个div，请尝试以下操作。

var div = document.getElementById("Div1");
do {
    div = div.nextSibling;
} while (div !== null && div.tagName !== "DIV");

编辑：我设置了一个jsFiddle来演示我认为你在寻找的东西：http://jsfiddle.net/9q6vz/

使用javascript获取相邻的div id

2 个答案: