用javascript显示所有隐藏div的最佳方法

我有几个隐藏在大div里面的div，它们可以一个接一个或一次全部显示出来 看起来是这样的：

<div class="maindiv">
   Print "<a href=javascript:show()>Click here to show all</a>
   <a href="javascript:showhide(document.getElementById('div1'))">Show/hide div1</a>
   <div id="div1" style="display:none;">.....</div>
   <a href="javascript:showhide(document.getElementById('div2'))">Show/hide div2</a>
   <div id="div2" style="display:none;">.....</div>
   ....
</div>

function show(){
   div1.style.display="block";
   div2.style.display="block";
   ...
}

所以如果我有100个div，我必须在那里输入100次

---

所以我的问题是，我如何在类maindiv的div中找到所有隐藏的div，并以枚举以外的其他方式显示它们？或者我这样做可以吗？

请尝试下面的代码片段

var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++){
   //You can also write here if condition
   divs[i].style.display = "block";
}

var divs=document.getElementsByTagName（“div”）；
对于（变量i=0；i

请尝试以下代码片段

var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++){
   //You can also write here if condition
   divs[i].style.display = "block";
}

var divs=document.getElementsByTagName（“div”）；
对于（变量i=0；i

尝试使用类似定义的通用css类名：

.hidden{
   display:none;
}

然后，您所要做的就是选择具有该类的元素并删除该类。假设您至少使用IE9，您可以尝试：

var divs = document.getElementsByClassName("hidden"); 
for(var i = 0; i < divs.length; i++)
{
   divs[i].className = ""; //assuming you only have that class set else you will need to do a search and replace
}

var divs=document.getElementsByClassName（“隐藏”）；
对于（变量i=0；i

---

如果您必须支持早期版本，则有其他方法可以收集您需要的所有div，例如

document.getElementsByTagName（“div”）

尝试使用类似定义的通用css类名：

.hidden{
   display:none;
}

然后，您所要做的就是选择具有该类的元素并删除该类。假设您至少使用IE9，您可以尝试：

var divs = document.getElementsByClassName("hidden"); 
for(var i = 0; i < divs.length; i++)
{
   divs[i].className = ""; //assuming you only have that class set else you will need to do a search and replace
}

var divs=document.getElementsByClassName（“隐藏”）；
对于（变量i=0；i

如果您必须支持早期版本，那么还有其他方法可以收集您需要的所有div，例如

document.getElementsByTagName（“div”）

我认为这是可行的

添加了重要内容，因为您有内联样式

我认为这可以工作

添加了重要内容，因为您有内联样式

试试这个：

JQuery

$('.maindiv div a').click(function(){
    $(this).next().toggle();
});

$('#showAll').click(function(){
    $('.maindiv div div').show();
});

HTML

<div class="maindiv">
   <a href="#" id="showAll">Click here to show all</a>
    <div>
        <a href="#">Show/hide div1</a>
       <div>.....</div>
       <a href="#">Show/hide div2</a>
       <div>.....</div>
    </div>
</div>

试试这个：

JQuery

$('.maindiv div a').click(function(){
    $(this).next().toggle();
});

$('#showAll').click(function(){
    $('.maindiv div div').show();
});

HTML

<div class="maindiv">
   <a href="#" id="showAll">Click here to show all</a>
    <div>
        <a href="#">Show/hide div1</a>
       <div>.....</div>
       <a href="#">Show/hide div2</a>
       <div>.....</div>
    </div>
</div>

使用jQuery，试试看

$("*").show();

或

或

请参阅和jQuery

$（）

，

$（）.find（）

，

$（）.filter（）

方法。

使用jQuery，请尝试

$("*").show();

或

或

---

请参阅和jQuery

$（）

，

$（）.find（）

，

$（）.filter（）

方法。

当我在下面看到您的代码时，我发现它几乎可以工作了。您需要将id='div1'更改为class='hid'，然后阅读下面的步骤>>继续

.....

当我在下面看到您的代码时，我发现它几乎可以工作了。您需要将id='div1'更改为class='hid'，然后阅读下面的步骤>>继续

.....

$（“div”）.show（）如果你可以使用jqueryIt，它不在你的标记中，那么我要提到的是，如果你不讨厌jquery，jquery可以很容易地处理这个问题。针对maindiv并添加一个类，然后你可以用css$（“div”）显示所有div。show（）如果你可以使用jqueryIt，它不在你的标记中，那么我要提到，如果你不讨厌jquery，jquery可以很容易地处理这个问题。以maindiv为目标并向其添加一个类，然后你可以用css显示所有div。应该是

display=“block”

而不是

display（“block”）

我从问题中复制了代码行。现在我已经更正了上面的代码片段。应该是

display=“block”

而不是

display（“block”）

我已经从问题中复制了代码行。现在我已经更正了我上面的代码片段。OP没有用jqueryyop标记question没有用jquery标记question我尝试了这个，期望它能工作，但由于一些奇怪的原因，它在每一个div中都不能工作。我稍后会看它，现在没有时间…

如果（I%2==1）I--内部循环解决了它，只是不知道为什么没有itI它就不能工作我尝试了这个，期望它能工作，但由于一些奇怪的原因，它在每一秒都不能工作。我稍后会看它，现在没有时间…
如果（I%2==1）I--内部循环解决了它，只是不知道没有它为什么不能工作