访问元素

我有以下列表层次结构：访问元素

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

我想一些CSS规则添加到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("a"); 
    for(var ii = 0; ii < links.length; ii++) { 
     links[ii].parentNode.style.display = "none"; // doesnt work 
    } 
}

我可以隐藏li项目，但不能做同样的a所以我不能达到div。我在这里做错了什么？

编辑：getElementsByClassName似乎不适用于greasemonkey脚本，因为它只是在Emmanuel N的小提琴中工作。

来源

2013-03-15 Adige72

那么：var divs = document.getElementsByClassName（“mydiv”）'？ – VisioN 2013-03-15 14:28:38

值得注意的是'a'标签内的div标签是无效的标记。如果你正在寻找一个通用的内联容器用户'span'。 – graphicdivine 2013-03-15 14:29:19

为什么你总是使用'parentNode'？只是在执行'myul.getElementsByTagName（“div”）'（或''a“'，不确定你真正想要的是什么）时会出错？ – Bergi 2013-03-15 14:33:55

您的代码似乎工作。退房this小提琴

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-15 14:42:34

我正在写一个greasemonkey脚本。可能是这个原因？ – Adige72 2013-03-15 14:45:17

可能是这个原因。 – 2013-03-15 14:46:30

你的代码实际上可以工作，但我认为它并不符合你打算做的事情。最后一行：links [ii] .parentNode.style.display =“none”实际上会隐藏a标签（即li）标签的父节点，而不是div。 parentNode将升级一级，而不是降级。

，而不是试图让myli [I] .getElementsByTagName（ “A”），然后往下运作，到div，为什么不myli [I] .getElementsByTagName（ “分区”），然后简单地做：

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-15 14:36:52 MisterSleep

如果你不反对使用jQuery，下面会隐藏自己的div你。

$(document).ready(function() { 
    var myDivs = $('div.mydiv'); 
    for(var eachDiv in myDivs) { 
     $(eachDiv).hide(); 
    } 
});

来源

2013-03-15 14:39:54

回答

相关问题