我有四个 HTMLdiv我想在单击时显示和隐藏它们如何执行此操作
<div id="targetid" class="image_one"><img src="image/imageone.png"/></div>
<div id ="targetidone "class="image_two"><img src="image/imagetwo.png"/></div>
<div id="targetidtwo" class="image_one_one"><img src="image/pagetwo_graph_two_11.png"/></div>
<div id ="targetidfour"class="image_two_two"><img src="image/pagetwo_graph_two_22.png"/></div>
下面是那两个div单击后上面的图像应隐藏和显示
<div class="option_image"><img src="image/option_1.png"/></div>
<div class="option_image_one"><img src="image/option_1.png"/></div>
如果您不使用任何第三方 javascript（例如：jQuery），则使用它：
document.getElementById('target-id').style.display = 'none'; // hide it
document.getElementById('target-id').style.display = 'block'; // show it (for block element, eg: div)
document.getElementById('target-id').style.display = 'inline'; // show it (for inline element, eg: span)
示例（1）：
<div id="target-id">hello workd</div> <!-- attribute: id -->
<a href="#" onclick="document.getElementById('target-id').style.display = 'none'; return false;">hide it</a>
<a href="#" onclick="document.getElementById('target-id').style.display = 'block'; return false;">show it</a>
示例（2）：
<div id="targetid" class="image_one" onclick="document.getElementById('targetid').style.display = 'none';"><img src="image/imageone.png"/></div> <!-- adding onclick to hide this element when you click it -->
<div class="option_image" onclick="document.getElementById('targetid').style.display = 'block';"><img src="image/option_1.png"/></div> <!-- adding onclick to show element #targetid when you click this -->
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
