javascript 选择器 document.object

Question

我试图在我的 html 页面中选择几个元素，我想知道为什么当我定位 html 元素时我应该一直使用该“文档”:

//变量体

var content = document.getElementsByTagName("body"); 

in next variable why I cannot use something like: get all p tags from body

var selector = content.querySelectorAll("p");

instead of using

var selector = document.querySelectorAll("p");

Answer 1

in next variable why I cannot use something like: get all p tags from body

因为 getElementsByTagName 返回一个 NodeList，而不是一个元素。如果你捕获一个匹配的元素，它就会起作用:

var content = document.getElementsByTagName("body")[0];
// ------------------------------------------------^^^
var paragraphs = content.querySelectorAll("p");

但只需使用 document.body 即可:

var paragraphs = document.body.querySelectorAll("p");

(当然，由于 p 元素不能位于 body 之外，因此这两个元素与此 document.querySelectorAll 相同强>具体案例。)

如果您希望所有 p 元素都是 body 的直接子元素，那么:

var paragraphs = document.querySelectorAll("body > p");