html ul 实现下拉,JavaScript实现下拉列表

本文实例为大家分享了JavaScript实现下拉列表的具体代码，供大家参考，具体内容如下

这一次写了一个比较简单的下拉列表的实现，点击出现列表内容，再次点击列表消失，研究了很久，发现这种js写法确实比较好用。先看一下效果。

直接上代码，js是主要写的部分，css是随意调试的，不过这个写法要用到css。

1、HTML部分的代码

第一

• a
• b
• c

第二

• 1
• 2
• 3

第二

• 4
• 5
• 6

第二

• 7
• 8
• 9

2、css部分的代码

.outer{

margin: 0 auto;

width: 500px;

height: 600px;

border: 1px solid red;