在日常开发中，我们经常会用到下拉列表功能，它能有效提升用户体验。那么，如何用 JavaScript 实现一个简单的下拉列表呢？下面给大家分享一个小技巧！👇

首先，在 HTML 中定义一个基本的下拉框结构：

```html

选项一

选项二

选项三

```

接着，通过 JavaScript 来动态操作这个下拉框。例如，当用户点击某个按钮时，可以显示或隐藏下拉选项：

```javascript

const dropdown = document.getElementById('dropdown');

const button = document.querySelector('button');

button.addEventListener('click', () => {

if (dropdown.style.display === 'none') {

dropdown.style.display = 'block';

} else {

dropdown.style.display = 'none';

}

});

```

这样，当你点击按钮时，下拉列表就会神奇地出现或消失啦！🌈

通过这种方式，你可以轻松定制自己的下拉菜单，让网页交互更有趣哦！💪