方括号表示法可用于document.querySelector

Question

我想通过将页面样式设置为display:none;并使用带有括号符号的querySelector来获取该元素，从而删除页面主体中的第三个div元素，但是我的代码返回错误< / p>

  

“ TypeError：el未定义”

当我尝试console.log("el")时会返回undefined

除了let和其他一些东西之外，我尝试使用const，var

var el = document.querySelector("div")[3]
el.style.display = "none"

它应删除页面中的第三个div。

Answer 1

您面临两个问题：

• querySelector()方法用于访问单个DOM节点。如果您打算使用多个元素，则可以使用document.querySelectorAll()方法，该方法返回节点 list
• 另一个问题是要记住数组使用从零开始的编号，这意味着[3]访问第四个元素，而不是第三个元素。计数从零开始。

牢记这两点，您正在寻找的是：

var el = document.querySelectorAll("div")[2]; // for the third div
el.style.display = "none";

Answer 2

我将总结@Sirko和@CoreyOgburn的评论：

不要使用document.querySelecto r，它返回一个single node，而是使用document.getElementsbyTagName (my suggestion)或坚持使用document.querySelectorAll("div")，这会返回一个Array站点上的div节点。或者，使用JQuery。而且，如果要获取第三个元素，则必须键入document.querySelectorAll("div")[2]，而不是[3]。