JS 创建新元素然后编辑该新元素中的 html

Question

我基本上是在尝试遍历一个数组并为数组中的每个数组项创建一个新的 div 元素，然后向创建的新 div 元素添加一些代码。我收到 Cannot set properties of null (setting 'innerHTML') 错误消息，我理解这意味着 JS 在运行时无法识别 div 元素，但可以肯定的是，如果我只是在它应该存在之前的行中创建它该行执行的时间。示例代码如下：

for (var elem in ArrayOfArray){
            document.createElement('div').setAttribute('id', elem[1]);
            document.getElementById(elem[1]).innerHTML = "hello (or some other code)";
        }

有谁知道为什么这不起作用？ TIA

Answer 1

document.getElementById 在文档中搜索具有给定 ID 的元素。

您已经创建了一个元素，为其设置了一个属性，然后将其丢弃。您没有保留对它的任何引用，也没有将它添加到文档中。

它不在文档中 getElementById 找不到。

const element = document.createElement('div');
element.setAttribute('id', elem[1]);
document.body.appendChild(element);
document.getElementById(elem[1]).innerHTML = "hello (or some other code)";

但是由于您需要保留对该元素的引用才能执行此操作，因此您可以完全跳过处理 ID。

const element = document.createElement('div');
document.body.appendChild(element);
element.innerHTML = "hello (or some other code)";

JS 创建新元素然后编辑该新元素中的 html

JS create new element then edit the html in that new element

javascript

arrays

arrayofarrays