[J框架知识扫盲]之querySelectorAll的应用2

随着Jquery对dom的编程的便利，HTML5也慢慢融入了对dom的编程的扩展。querySelectorAll就是一个很好的例子.

 

Document.querySelectorAll

返回当前文档中匹配一个特定选择器的所有的元素(使用depth-first pre-order这样的规则遍历所有文档节点) .返回的对象类型是 NodeList.

语法：

elementList = baseElement.querySelectorAll(selectors);

 其中

elementList会是一个non-live的NodeList对象.

baseElement是一个元素对象.

selectors是一个由逗号连接的包含一个或多个CSS选择器的字符串.

selectors的规法：

• "＃id" ：获取含有id="id"的元素
• ".css"：获取class属性包含“css”的所有元素
• “tag”：获取tagName为"tag"的所有元素
• "[attr='value']"：获取元素含有attr属性的所有元素，如果加上"=value"，则表示获取元素含有attr属性且此元素的值需为value，更多：[name*="value"] 包含， [name$="value"]结尾，[name^="value"]开头
• parent child 获取包含child的所有元素，parent > child  只获取第一层。parent > child > child获取第二层，以此类推。

 

tag和css可以接合使用，如："div.red"，表示所有class属性包含red的所有div元素

 

英文版本：http://openxtiger.iteye.com/blog/1611723