如何在单击任意位置时关闭下拉列表

document.addEventListener('click', function(event) {
  var dropdown = document.getElementById('dropdown'); // 下拉列表的DOM元素
  if (dropdown.classList.contains('open')) {
    dropdown.classList.remove('open');
  }
});

<style>
  .dropdown {
    position: relative;
  }
  .dropdown.open .dropdown-menu {
    display: block;
  }
  .dropdown-menu {
    display: none;
    /* 下拉列表的样式 */
  }
  .dropdown-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
  }
</style>

<div class="dropdown">
  <button class="dropdown-toggle">下拉列表</button>
  <ul class="dropdown-menu">
    <!-- 下拉列表的选项 -->
  </ul>
  <div class="dropdown-overlay"></div>
</div>

<script>
  var dropdown = document.querySelector('.dropdown');
  var overlay = document.querySelector('.dropdown-overlay');
  dropdown.addEventListener('click', function(event) {
    event.stopPropagation();
    dropdown.classList.toggle('open');
  });
  overlay.addEventListener('click', function() {
    dropdown.classList.remove('open');
  });
</script>