点击消失

最新推荐文章于 2021-04-01 14:51:30 发布

weixin_30914981

最新推荐文章于 2021-04-01 14:51:30 发布

阅读量49

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yoyoyoyoyoyo/p/5815500.html

本文介绍了一个简单的HTML页面，使用内联样式定义了两个列表项，并通过JavaScript实现了当点击第一个列表项时，第二个列表项显示或隐藏的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style>
 7     ul
 8     {
 9         list-style: none;
10 
11     }
12     #aa
13     {
14         width: 200px;
15         height: 100px;
16         background: pink;
17     }
18     ul #a
19     {
20         width: 200px;
21         height: 500px;
22         background: #3c3c3c;
23     }
24     </style>
25 </head>
26 <body>
27     <ul>
28         <li id="aa"></li>
29         <li id="a"></li>
30     </ul>
31 
32 
33     <script>
34     var chan1=document.getElementById('aa');
35     var chan2=document.getElementById('a');
36         chan1.onclick=function (){
37             if (chan2.style.display=="block") {
38                 chan2.style.display="none";
39             }else{
40                 chan2.style.display="block";
41             };            
42         };
43 
44     </script>
45 </body>
46 </html>