Javascript 动态创建引导网格

我尝试使用JavaScript函数动态生成引导列。目标是将它们作为不同的列显示在一行中

目前情况是这样的：

我正在使用div id对window.onload（）调用此函数：

// Update the bootstrap grid once the tasks are added
function updateTaskContainerHead(containerId){
    let containerHead = document.getElementById(containerId);
    // Take the row headings and make an HTML container out of them
    let tblRowHeadings = ['Task Name','Assigned To','Priority','Due Date',''];
    let tblHeadRow = document.createElement("div");
    tblHeadRow.classname="row";
    for (let heading of tblRowHeadings){
        let tblHeadCell = document.createElement("div");
        tblHeadCell.className="col";
        let cellText = document.createTextNode(heading);
        tblHeadCell.appendChild(cellText);
        tblHeadRow.appendChild(tblHeadCell);
    }
    containerHead.appendChild(tblHeadRow);
}

HTML组件只是：

<lead>Completed Tasks</lead>
<div class="container" id="ongoingTasksContainer">

已完成的任务

---

您认为可能是什么问题？

您没有正确设置

tblHeadRow

类

您需要使用

element.classList.add（className）

方法

如果改用此选项，则会有以下列：

tblHeadRow.classList.add("row");

这是一个供参考的例子

---

---

但是，我真的建议在这种情况下使用表。如果您正在创建一个

tbl

，

head

和

cell

，那么您所追求的似乎就是一个表格，而且也是一个拼写。。区分大小写：

tblHeadRow.classname="row";

应该是：

tblHeadRow.className="row";

---

嗨，Swopnil，如果你发现我的答案回答了你的问题，请投票并/或接受。如果你仍然有悬而未决的问题，请让我知道，我很乐意帮助我，我可以！