现在这个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不就得了