从javascript创建引导下拉按钮

我需要帮助使用引导类和定制从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="btn btn-success" href="#" id="testbtn" onclick="javascript('ActionTxT1' , 'dropdownMenuButton', 'btn btn-success')">Action</a>
    <a class="btn btn-warning" href="#" id="testbtn" onclick="javascript('ActionTxT2' , 'dropdownMenuButton', 'btn btn-warning')">Another action</a>
    <a class="btn btn-danger" href="#" id="testbtn" onclick="javascript('ActionTxT3' , 'dropdownMenuButton', 'btn btn-danger')">Something else here</a>
  </div>
</div>

---

但在这里，我开始出现错误，我甚至不确定我是否朝着正确的方向前进。

当设置带有破折号的属性时，可能会出现错误：

btn.data-toggle = "dropdown";

要设置属性，有三个选项：

1） 使用

setAttribute（）

方法：

btn.setAttribute('data-toggle', "dropdown");

let div = document.getElementById('mydiv');
div.appendChild(btn);

2） 在

数据集中设置属性

btn.dataset['data-toggle'] = "dropdown";

3） 用例表示法：

btn.dataset.dataToggle = "dropdown";

生成元素时，使用
appendChild
方法将其添加到现有元素中：

btn.setAttribute('data-toggle', "dropdown");

let div = document.getElementById('mydiv');
div.appendChild(btn);

要在JS中创建整个引导下拉列表，您将对每个子元素重复此过程。
您可以查看下面的JSFIDLE-

你犯了什么错误？嗨，Ashique，js小提琴坏了。我已经尝试过复制代码并用按钮触发它，因为window.onload没有对它做任何操作。它似乎不起作用，尽管它看起来确实与我想做的非常不同。谢谢：-）Hi Asique，我发现了$（“.main div”）.append（div）；行未将项目追加到页面。我将其替换为document.body.append（div）；你好，Robert，是的，您需要将append函数更改为正确的父元素，这样才能工作。这对你有用吗？