为什么document.getElementById不在这里工作？

-1

我正在使用我的第一个纯JavaScript应用程序，我无法弄清楚为什么我的document.getElementById在下面的代码块的最后一块不起作用。我用document.addEventListener('DOMContentLoaded', function() {first functions called}开始我的脚本，并且元素无障碍地加载到DOM。为什么document.getElementById不在这里工作？

在将元素添加到我的页面之前，我的代码是跳到最后一个块（开始var x）的问题吗？如果是这样，是否有任何方法告诉代码挂起？最终我想在后面的函数中调用document.getElementById（修改DOM）。

function populateRefineMenu(arr, chosenArr, category) { 
    var categoryUL = document.createElement('ul'); 
    categoryUL.className = 'refine-menu-ul'; 
    categoryUL.Id = 'refine-' + category; 

    var clearFilter = document.createElement('li'); 
    clearFilter.className = 'clear-filter'; 
    clearFilter.Id = 'genre-clear-filter'; 
    console.log('This ID is ' + clearFilter.Id); // logs fine 
    clearFilter.innerHTML = 'Clear Filter'; 
    console.log("clearFilter is " + clearFilter.innerHTML); // logs fine 

    refineMenu.appendChild(categoryUL); 
    categoryUL.appendChild(clearFilter); 

    var x = document.getElementById('genre-clear-filter'); 
    console.log(x) // logs "null" 
    console.log(x.innerHTML) // "cannot read property 'innerHTML' 
}

感谢您的建议！

来源

2016-08-11 dedaumiersmith

对象属性区分大小写。它应该是'clearFilter.id'。 – JJJ

哦，所以我为对象创建了一个新的键和值，而不是设置ID。得到它了。谢谢！ – dedaumiersmith

除了你的拼写错误，你的问题是你没有添加创建的ul到DOM。创建x之前，该行添加到您的代码

document.body.appendChild(categoryUL);

，因为否则将不会出现在文档对象模型（DOM）等，document.getElementById不能拿来。

P.S：如果您打算使用循环创建多个li，请确保您为每个li提供不同的ID。根据规范，id在DOM中必须是唯一的。

P.P.S：与您的代码的其他问题是

Id应改为id调用由document.getElementById
refineMenu未定义

来源

2016-08-11 20:34:33 naveen

为什么document.getElementById不在这里工作？

回答

相关问题