时间戳

首页 > 解决方案 > 如何使用 javascript 和 bootstrap 将项目添加到下拉列表

javascript - 如何使用 javascript 和 bootstrap 将项目添加到下拉列表

问题描述

我已经获取了当前日期时间的所有区域，并且我想将所有这些 387 个区域添加到我的引导下拉列表中。基本上如何使用 javascript 将项目添加到引导下拉列表。这是基本的html代码：

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
  </div>
</div>

标签： javascripthtmlcsstwitter-bootstrap

解决方案

你可以做这样的事情，确保区域不是用户输入，因为这会添加 html。

const div = document.querySelector('.dropdown-menu');
const regions = ['Europe', 'America'];
regions.forEach(region => {
    div.innerHTML += `<a class="dropdown-item" href="#">${region}</a>`;
})

推荐阅读