.pop不是一个函数 - DOM [重复]。

Question

这个问题在这里已经有了答案:

querySelectorAll和getElementsBy*方法返回什么？ (9个回答)

封闭 上月.

var input = document.getElementById("userinput");
var button = document.getElementById("button");

var ul = document.querySelector("ul");



button.addEventListener("click", function() {

  var li = document.createElement('li');
  li.textContent = input.value;
  ul.appendChild(li);
  input.value = "";


  liarray = document.querySelectorAll("li");

  li.addEventListener("click", function() {
    liarray.pop();

  })
})

当我运行并点击一个li元素时，我得到一个 "Uncaught TypeError: liarray.pop is not a function "的错误信息。

有什么帮助吗？谢谢你的帮助

Answer 1

querySelectorAll 不返回一个数组，而是返回一个 NodeList. NodeList的没有一个 pop 方法。

如果你想要一个数组:

liarray = Array.from(document.querySelectorAll("li"));

...或者其他类似的方法，比如... ..:

liarray = [...document.querySelectorAll("li")];

...但请注意，那是依赖于... NodeList 是可迭代的，而它们是在最近一两年才变得可迭代的，所以它依赖于一个相当最新的浏览器。Array.from 是比较老的（而且很容易被填充）。

---

话说回来，看你的代码，我觉得你并不希望在你的代码中使用 liarray 我想你也不希望... pop. 看起来你想在点击时删除一个元素。如果是这样。

var input = document.getElementById("userinput");
var button = document.getElementById("button");

var ul = document.querySelector("ul");

button.addEventListener("click", function(){
    var li = document.createElement('li');
    li.textContent=input.value;
    ul.appendChild(li);
    input.value = "";
    li.addEventListener("click", function(){
        this.remove(); // Or `this.parentElement.removeChild(this);` on older browsers
    });
});