使用if条件判断，来实现div标签的显示和隐藏效果的切换。
代码如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #div1{ width: 100px; height: 200px; background: green; } </style> <script> function showhide(){ var oDiv = document.getElementById('div1'); if(oDiv.style.display == 'none'){ oDiv.style.display = 'block'; }else{ oDiv.style.display = 'none'; } } </script> </head> <body> <input type="button" value="显示隐藏" onclick="showhide()"> <div id="div1" style="display: none;"></div> </body> </html>
注意：
- 在位display属性赋值的时候，它的值是字符串格式的。不能省略单引号（或者双引号）。
- 标签有个属性是style，而display是style属性的属性。应该说style是一个属性的集合。
- 在<style></style>标签中，div标签的dispaly可以直接写。
在函数中，要想修改标签的属性的值，首先还是要先获取这个标签。