1

次のリスト階層があります。

<ul id="ulid">
    <li><a><div class="mydiv">content</div></a></li>
    <li><a><div class="mydiv">content</div></a></li>
    ...
</ul>

divにいくつかのcssルールを追加したいのですが、これは私がこれまでに試したことです:

var myul = document.getElementById("ulid");
var myli = myul.getElementsByTagName("li");
for(var i = 0; i < myli.length; i++) {
    //myli[i].parentNode.style.display = "none"; // that works
    var links = myli[i].getElementsByTagName("a");
    for(var ii = 0; ii < links.length; ii++) {
        links[ii].parentNode.style.display = "none"; // doesnt work
    }
}

liアイテムを非表示にすることはできますが、同じことを行うことはできませんa。そのため、div に到達できません。ここで何が間違っていますか?

編集: getElementsByClassNameEmmanuel N のフィドルで動作するだけなので、グリースモンキー スクリプトでは動作しないようです。

4

3 に答える 3

0

jQueryの使用に反対しない場合は、次のようにdivを非表示にします。

$(document).ready(function () {
    var myDivs = $('div.mydiv');
    for(var eachDiv in myDivs) {
        $(eachDiv).hide();
    }   
 });
于 2013-03-15T14:39:54.557 に答える
0

あなたのコードは実際には機能しますが、あなたが意図したとおりに機能するとは思いません。最後の行:links [ii] .parentNode.style.display = "none"は、実際にはdivではなくタグ(つまりli)タグの親ノードを非表示にします。parentNodeは、下ではなく1レベル上に移動します。

myli [i] .getElementsByTagName( "a")を取得してdivに移動する代わりに、myli [i] .getElementsByTagName( "div")を実行して、次のようにします。

var myul = document.getElementById("ulid");
var myli = myul.getElementsByTagName("li");
for(var i = 0; i < myli.length; i++) {
    //myli[i].parentNode.style.display = "none"; // that works
    var links = myli[i].getElementsByTagName("div");
    for(var ii = 0; ii < links.length; ii++) {
        links[ii].style.display = "none"; 
    }
}

もちろん、それを行うにはもっと効率的な方法がたくさんあります。すでにdivにクラス名があるので、

document.getElementsByClassName("mydiv");

同様に機能します。

または、jQueryを使用する場合は、明示的に繰り返すことなく同じことを実行できます。

$("div.mydiv").css(etc.); // style this however you want
于 2013-03-15T14:36:52.837 に答える
0

あなたのコードはうまくいくようです。このフィドルをチェックしてください

  var myul = document.getElementById("ulid");
  var myli = myul.getElementsByTagName("li");
  for(var i = 0; i < myli.length; i++) 
  {
       var links = myli[i].getElementsByTagName("a");
       for(var ii = 0; ii < links.length; ii++) 
       {
              links[ii].parentNode.style.display = "none";
       }
  }
于 2013-03-15T14:42:34.517 に答える