Javascript getElementById在通过HTMLcollection循环时尝试追加时引发错误

我试图附加一些动态创建的html。它在使用getElementById时抛出错误。审计表元素是DOM中具有该特定类的div

<div class="audit-table-element"></div>

Javascript:

var elems = document.getElementsByClassName('audit-table-element');
for(var i = 0; i < elems.length; i++) {
    elems[i].getElementById("always-audit-table" + category.id + "")
            .getElementsByTagName("tbody")[0]
            .insertAdjacentHTML("beforeend", auditTableRow);
}

错误-TypeError:elems[i]。getElementById不是函数

当我删除行getElementByIdalways audit table+category.id+时，追加正在工作，但追加到了错误的位置。因此，我需要将该行添加到HTML的正确位置

您可以使用querySelector而不是getElementById。您的代码应该如下所示

elems[i].querySelector("[id = always-audit-table" + category.id + "]")
        .getElementsByTagName("tbody")[0]
        .insertAdjacentHTML("beforeend", auditTableRow);

querySelector：它们用于根据HTML元素的id、类、类型、属性、属性值等选择HTML元素

您可以使用querySelector而不是getElementById。您的代码应该如下所示

elems[i].querySelector("[id = always-audit-table" + category.id + "]")
        .getElementsByTagName("tbody")[0]
        .insertAdjacentHTML("beforeend", auditTableRow);

querySelector：它们用于根据HTML元素的id、类、类型、属性、属性值等选择HTML元素

---

我不知道您的代码是什么样子，但我尝试在这里创建一个示例。看看这个，你的疑虑会消除的

var testRow=数据1数据2； var ele=document.getElementsByClassName'test'； forvar i=0；i我不知道您的代码是什么样子，但我尝试在这里创建一个示例。看看这个，你的疑虑会消除的

var testRow=数据1数据2； var ele=document.getElementsByClassName'test'； forvar i=0；igetElementbyId与文档而不是元素一起工作。@Shiladitya有任何可能的解决方法吗？我必须使用id来获取正确的元素！但是，GetElementsByTagnetBody[0]是否正常工作？是否为整个循环修复了category.id？这似乎意味着文档中的多个元素共享同一个id，这是无效的HTML。我不知道代码中是否有很多错误，或者是什么，但是提供的div的类名与javascript中的任何类名都不匹配，正如Ry指出的，如果您有多个Id相同的元素，似乎您的HTML可能无效。audit-table-element是类或Id？getElementbyId用于文档而不是元素。@Shiladitya有什么解决方法吗？我必须使用id来获取正确的元素！但是，GetElementsByTagnetBody[0]是否正常工作？是否为整个循环修复了category.id？这似乎意味着文档中的多个元素共享同一个id，这是无效的HTML。我不知道代码中是否有很多错误，或者是什么，但是提供的div的类名与javascript中的任何类名都不匹配，正如Ry指出的，如果有多个元素具有相同的Id，则似乎可能有无效的HTML。audit-table-element是类还是Id？