document.querySelectorAll和querySelector用法
内容提要
querySelectorAll和querySelector是选择文档中匹配CSS选择器的元素的方法，querySelector返回第一个匹配的元素，querySelectorAll返回所有匹配的元素数组。可以使用通配符选择所有标签，也可以根据父元素、class、id、属性等进行选择。还可以使用伪类选择特定条件下的元素，如选择索引为偶数的tr标签。
关键要点
-
querySelector() 方法返回文档中匹配指定 CSS 选择器的第一个元素。
-
querySelectorAll() 方法返回所有匹配的节点并返回数组。
-
可以使用通配符选择所有标签，如 document.querySelectorAll('*')。
-
可以根据父元素选择标签，如 document.head.querySelectorAll('*')。
-
可以选择特定标签，如 document.body.querySelectorAll('div')。
-
可以选择第一个匹配的标签，如 document.body.querySelector('div')。
-
可以根据 class 选择标签，如 document.querySelectorAll('.box')。
-
可以根据 id 选择标签，如 document.querySelectorAll('#box')。
-
可以选择具有特定属性的标签，如 document.querySelectorAll('*[name=sex]')。
-
可以选择具有多个条件的标签，如 document.querySelectorAll('p.txt[name]')。
-
可以选择特定结构的标签，如 document.querySelectorAll('div.test>p:first-child')。
-
可以使用属性选择器选择 id 属性以特定字符串开头、结尾或包含的标签。
-
可以使用伪类选择特定条件下的元素，如选择索引为偶数或奇数的 tr 标签。
