初学JS,请教循环写法

现在这个js只定义了一个div1点击显示隐藏,但是如果有100个div的话,语句就会写很长了。要怎么简洁定义这div1~100 的js啊。

 <input type="button" value="显示隐藏" onClick="showHide()" />
<div id="div1"></div>

<script>
function showHide()
{
    var oDiv=document.getElementById('div1');

    if(oDiv.style.display=='block')
    {
        oDiv.style.display='none';
    }
    else
    {
        oDiv.style.display='block';
    }
}
</script>
<style>
#div1 {width:100px; height:200px; background:#CCC; display:none;}
</style>

有一个很近的跟你问题类似,刚刚回答了一个,直接查看即可。望采纳我的代码。

 https://ask.csdn.net/questions/710135

你是想一次控制100个div的显示隐藏,还是每个是每个

 <input type="button" value="显示隐藏" onClick="showHide()" />
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<div id="div5"></div>
<div id="div6"></div>
<div id="div7"></div>
<div id="div8"></div>
<div id="div9"></div>
<div id="div10"></div>


<script>
function showHide()
{
for(i=1;i<11;i++){
var id="div"+i;
 var oDiv=document.getElementById(id);

    if(oDiv.style.display=='block')
    {
        oDiv.style.display='none';
    }
    else
    {
        oDiv.style.display='block';
    }
}

}
</script>
<style>
#div1 {width:100px; height:200px; background:#CCC; display:none;}
</style>

你可不可以 在100个 div 外侧 在家一个 div 包裹起来, 然后控制 包裹div 的显示隐藏

不知道你要js 还是jq

js:
 document.querySelectorAll('div').forEach((item,i)=>{item.style.display=item.style.display=='none'?'block':'none';}) ;
jq:
$('div').toggle();

用class不就得了