如何用JavaScript编写实现下拉菜单功能的代码？

本文共计858个文字，预计阅读时间需要4分钟。

使用JavaScript实现下拉菜单，以下为参考代码和思路：

javascript// 创建下拉菜单HTML结构let menu=document.createElement(select);menu.innerHTML=` 选项1 选项2 选项3`;

// 将下拉菜单添加到页面document.body.appendChild(menu);

// 绑定下拉菜单变化事件menu.onchange=function() { // 获取选中的值 let selectedValue=this.value; console.log(选中的值： + selectedValue);};

// 或者使用侧滑菜单let sidebar=document.createElement(div);sidebar.style.position=fixed;sidebar.style.top=0;sidebar.style.left=0;sidebar.style.width=200px;sidebar.style.height=100%;sidebar.style.backgroundColor=black;sidebar.innerHTML=` 选项1 选项2 选项3 `;

document.body.appendChild(sidebar);

// 绑定侧滑菜单点击事件sidebar.onclick=function(event) { if (event.target.tagName===LI) { console.log(点击的选项： + event.target.innerText); }};

以上代码展示了如何使用JavaScript创建下拉菜单和侧滑菜单，并绑定事件监听器以获取用户选择的值。