Javascript 动态填充表中的下拉功能

我试图根据数据库中的用户动态填充表。对于每个用户，我需要一个下拉选项来更改其角色。我将引导用于此下拉菜单，因此我包括：

  <script src=".\..\javascripts\jquery.js"></script>
  <script src=".\..\plugins\bootstrap-4.4.1-dist\js\bootstrap.bundle.min.js"></script>

使用此代码，我得到的情况与中相同。 于是我搬走了

tempButtonRole.setAttribute("data-toggle", "dropdown");

但无论是否有这一行，下拉菜单都不起作用：单击按钮时，不会显示任何下拉菜单。 我尝试了“选择”而不是元素“a”：

---

现在出现下拉列表，但选项为空，即使tempButtonRole的innerHTML也不显示，按钮为空。我是否缺少任何属性或我做错了什么？如上所述，静态方法工作得非常好。

您是否可以发布一个快速stackblitz示例？感谢您的快速回复！我决定用不同的方式编写代码，因此不再有这个问题。由于我对stackblitz不熟悉，所以我需要一些时间来正确设置它。但是谢谢你的帮助！

 //Button for Role
          let roleButtonCell = row.insertCell(i);
          i++;


          //Div for bootstrap for Role Button
          var tempDivRole = document.createElement("div");
          tempDivRole.className = "dropdown show";


          //Role change and display
          var tempButtonRole = document.createElement("a");
          tempButtonRole.setAttribute("role", "button");
          tempButtonRole.className = "btn btn-secondary dropdown-toggle";  //ClassName for bootstrap
          tempButtonRole.setAttribute("href", "#");
          tempButtonRole.setAttribute("id", "dropdownMenuLink");
          tempButtonRole.setAttribute("data-toggle", "dropdown");
          tempButtonRole.setAttribute("aria-haspopup", "true");
          tempButtonRole.setAttribute("aria-expanded", "false");
          tempButtonRole.innerHTML = `${user.role}`;



          //DropDown Options for roles
          var tempDropdownRoles = document.createElement("div");
          tempDropdownRoles.className ="dropdown-menu";
          tempDropdownRoles.setAttribute("aria-labelledby", "dropdownMenuLink");

          var tempDropdownItemAdmin = document.createElement("a");
          tempDropdownItemAdmin.className = "dropdown-item";
          tempDropdownItemAdmin.setAttribute("href", "#");
          tempDropdownItemAdmin.innerHTML = `Admin`;
          var tempDropdownItemUser = document.createElement("a");
          tempDropdownItemUser.className = "dropdown-item";
          tempDropdownItemUser.setAttribute("href", "#");
          tempDropdownItemUser.innerHTML = `User`;
          var tempDropdownItemMaintainer = document.createElement("a");
          tempDropdownItemMaintainer.className = "dropdown-item";
          tempDropdownItemMaintainer.setAttribute("href", "#");
          tempDropdownItemMaintainer.innerHTML = `Maintainer`;

          tempDropdownRoles.appendChild(tempDropdownItemAdmin, tempDropdownItemUser, tempDropdownItemMaintainer);

          //Add Button Edit to div and div to cell
          tempDivRole.appendChild(tempButtonRole, tempDropdownRoles);
          roleButtonCell.appendChild(tempDivRole);

tempButtonRole.setAttribute("data-toggle", "dropdown");

          var tempButtonRole = document.createElement("select");