需要隐藏/取消隐藏按钮点击时动态创建的下拉列表

// 获取按钮和下拉列表容器的引用
const toggleBtn = document.getElementById('toggleBtn');
const dropdownContainer = document.getElementById('dropdownContainer');

// 监听按钮的点击事件
toggleBtn.addEventListener('click', function() {
  // 检查下拉列表容器的显示状态
  if (dropdownContainer.style.display === 'none') {
    // 如果下拉列表容器是隐藏的，则创建下拉列表
    createDropdown();
  } else {
    // 如果下拉列表容器是显示的，则移除下拉列表
    removeDropdown();
  }
});

// 创建下拉列表函数
function createDropdown() {
  // 创建下拉列表元素
  const dropdown = document.createElement('select');
  
  // 添加选项
  const option1 = document.createElement('option');
  option1.text = '选项1';
  dropdown.add(option1);
  
  const option2 = document.createElement('option');
  option2.text = '选项2';
  dropdown.add(option2);
  
  // 将下拉列表添加到容器中
  dropdownContainer.appendChild(dropdown);
  
  // 显示下拉列表容器
  dropdownContainer.style.display = 'block';
}

// 移除下拉列表函数
function removeDropdown() {
  // 移除下拉列表元素
  dropdownContainer.removeChild(dropdownContainer.firstChild);
  
  // 隐藏下拉列表容器
  dropdownContainer.style.display = 'none';
}