javascript库中最常用的一项功能,就是根据CSS选择符选择与某个模式匹配的DOM元素。实际上jQuery的核心就是通过css选择符查询DOM文档取得元素的引用,从而抛开了getElementById()和getElementByTagName()
Selectors API就是有W3C发起的一个标准,致力于让浏览器原生支持CSS查询。
Selectors API 的核心两个方法:querySelector()和querySelectorAll().在兼容的浏览器中可以通过Document及Element类型的实例调用它们。
querySelector()方法接收一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null。
var body=document.querySelector("body"); alert(body.nodeName);//BODY
querySelectorAll()方法接收的参数与querySelector()方法一样,都是一个CSS选择符,但返回的是所有匹配的元素而不仅仅是一个元素。该方法返回一个NodeList的实例。返回的值实际上是带有所有属性和方法的NodeList,其底层实现则类似与一组元素的快照,而不是对文档进行搜索的动态查询。
要取得NodeList中的每一个元素,可以使用item()方法,也可以使用方括号语法。
matchesSelector()方法
Selector API Level2为ELement类型新增了一个方法matchesSelector()。这个方法接收一个参数,即CSS选择符,如果调用元素与该选择符匹配,则返回true,否则返回false。
CSS选择符(引用自疯狂的兔子的博客)
时间: 2024-10-05 10:09:33