JavaScript: 不能在创建元素后立即 select 个元素吗？

Question

我的脚本包含以下导致我出现问题的代码：

btn.addEventListener('click', ()=> {
  if (!gamePlay) {
    setup()
    let word=document.querySelectorAll('box')
    console.log(word)
    btn.classList.toggle('hidden')
    gamePlay=true
  }
})

代码的重置可以看这个JSfiddle（不介意顺便注释掉的代码）：https://jsfiddle.net/apasric4/6k7anpvu/1/

在函数 setup() 中创建了所有 div 元素之后，我试图通过 class 名称 select 它们 (box)但是该部分的节点列表是一个空节点列表（也显示在控制台中）。

我假设代码是同步的。我似乎无法访问通过调用 setup().

创建的元素

Answer 1

您可以在创建文档元素后立即对其进行访问和查询。

这里的问题是你select或者语法不正确； select box class 的元素，在 select 或“.”前加上前缀：

btn.addEventListener('click', () => {

  if (!gamePlay) {

    setup();

    let word = document.querySelectorAll('.box'); // Prefix .
    console.log(word);
    btn.classList.toggle('hidden');

    gamePlay = true;
  }
})

JavaScript: 不能在创建元素后立即 select 个元素吗？

JavaScript: can't immediately select elements after creating them?

javascript

hoisting

nodelist