0

この問題のJavascriptソリューションを探しています。私は次のHTMLを持っています：

<div id = "container">
  <div id = "data">
    <div>
      <h3> Address</h3>
      <b>Expand...</b>
      <div id="content">ul. Pomorska</div>
    </div>
    <div>
      <h3> Telefon </h3> <b>Expand...</b>
      <div id="content">26565352</div>
    </div>
    <div>
      <h3>Email</h3>
      <b>Expand...</b>
      <div id="content">asdasdag@aga.com</div>
    </div>
  </div>
</div>

onclick Expandが行われたときに、コンテンツdivを非表示にします。これまで、コンテンツdivを非表示にして、ノードにイベントハンドラーを割り当てようとする関数を作成しました。

function hideinfo() {
  var node = document.getElementById("data");
  var contactdata = node.getElementsByTagName("div");
  for(var i=0; i<contactdata.length;i++) {
    if(contactdata[i].id == "content") {
      alert(contactdata[i].previousSibling.innerHTML);
      contactdata[i].previousSibling.addEventListener('click',ShowHide,false);
      contactdata[i].style.display="none";
    }
  }
}

問題は、アラートが未定義で表示されることです。なぜノードが見えないのですか？Javascriptでこれを行うためのより良い方法はありますか？

4

2 に答える 2

1

要素previousSiblingの前のテキストノードである可能性が高いためです。divおそらく代わりに使用したいと思うでしょうpreviousElementSibling:)

今日のほとんどのブラウザーでは、 CSSセレクターを使用して要素を検索できるquerySelectorAllも優れた代替手段です（IE8 +）

于 2012-11-18T10:48:12.310 に答える
1

previousSiblingプロパティは、選択した要素の前の兄弟ノード（同じツリーレベルの前のノード）を返します

これは、あなたの場合はTEXTノードを返します。

あなたがこのjsfiddleで見ることができるように：http：//jsfiddle.net/Xu383/

alert(contactdata[i].previousSibling.nodeName);

querySelectorAllを使用することをお勧めします。

また、同じIDを持つ複数のdivを持つことはできません。代わりに、クラスを使用してください。

于 2012-11-18T10:52:48.023 に答える