当我在 javascript 中手动创建列表时，无法使用 querySelectorAll();答案

【问题标题】：When i create list manually in javascript, cant get the values using querySelectorAll();当我在 javascript 中手动创建列表时，无法使用 querySelectorAll();
【发布时间】：2017-02-27 05:57:06
【问题描述】：

  let List = document.createElement("div");
        List.setAttribute('id', 'name');
        let List1 = document.createElement("ul");
         let List2 = document.createElement("li");
            let  Value = document.createTextNode("america");
            List2.appendChild(Value);
         let List3 = document.createElement("li");
                 Value = document.createTextNode("london");
            List3.appendChild(Value);
            List1.appendChild(List2);
            List1.appendChild(List3);
            List.appendChild(List1);

当我输入 let li = document.querySelectorAll("#name li");

我没有得到带有 li 标签的列表元素？？代码有什么问题？

【问题讨论】：

标签： javascript list typescript nodes

【解决方案1】：

否则该调用将是：

List.querySelectorAll("#name li");
//better more  
List.querySelectorAll("li");
//because you already have the handle for #name element in your hands.

无论它们是否已附加到文档中，您都将获得查询的元素。

永远不要在查询选择器上调用文档元素，以防您已经拥有查询主题的根节点。或者，如果本地包装器唯一 ID 已经可用。

太贵了！

您应该始终避免这种情况。

除非没有其他选择，否则永远不要使用查询选择器。

List.getElementsByTagName("li");

始终是一种更可取的方式 - 而且速度快得多。

【讨论】：

【解决方案2】：

您需要将您创建的List 节点附加到文档中。试试这个：

let List = document.createElement("div");
List.setAttribute('id', 'test');
let List1 = document.createElement("ul");
let List2 = document.createElement("li");
let  Value = document.createTextNode("java");
List2.appendChild(Value);
let List3 = document.createElement("li");
Value = document.createTextNode("ajax");
List3.appendChild(Value);
List1.appendChild(List2);
List1.appendChild(List3);
List.appendChild(List1);

document.body.appendChild(List);

现在您的 document.querySelectorAll 语句应该可以工作了。

【讨论】：

它的抛出 TypeError: document.body.append is not a function(...) @NahushFarkande
appendChild 正在工作.. 谢谢！ @NahushFarkande
对！我的错。乐于助人:)

【解决方案3】：

我认为这是因为您实际上并未将List 添加到文档中。

【讨论】：