0

シンプルな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を取得する方法です！

4

2 に答える 2

1

domオブジェクトのnextSiblingプロパティを使用して、隣接するdivにアクセスできます。

于 2013-01-08T12:49:11.727 に答える
0

Ankur の回答をお勧めしますが、nextSibling には十分注意する必要があります。次のマークアップを見てください。

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

クロムdocument.getElementById("Div1").nextSiblingでは、 id の div が返されDiv2ます。divただし、IE では、同じ行が両方のタグ間の空白を参照する #Text ノードを返します。

次を取得できることを確認するには、次のことをdiv試してください。

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

編集:私はあなたが探していたと私が思うかもしれないものを示すjsFiddleをセットアップしました: http://jsfiddle.net/9q6vz/

于 2013-01-08T12:56:30.267 に答える