1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta charset="UTF-8">
5 <title></title>
6 <script type="text/javascript">
7 function showAndHidden(id,btid){
8 var target = document.getElementById(id);
9 target.hidden = !target.hidden;
10 if(target.hidden){
11 document.getElementById(btid).innerHTML = "显示";
12 }else{
13 document.getElementById(btid).innerHTML = "隐藏";
14 }
15 }
16 </script>
17 </head>
18 <body>
19 <button id="bt1" onclick="showAndHidden(‘target‘,‘bt1‘)">显示</button>
20 <div id="target" hidden="true" style="height: 80px">
21 文字内容
22 </div>
23 </body>
24 </html>
hidden 元素属性 与CSS中的display等效，display:none 就是隐藏，display: block 等其他显示方式就是显示
时间： 2024-10-11 14:28:24