- css 选择器与 xpath 用法对比
| 目标 | 匹配节点 | CSS 3 | XPath |
|---|---|---|---|
| 所有节点 | ~ |
* |
//* |
| 查找一级、二级、三级标题节点 | <h1>,<h2>,<h3> |
h1,h2,h3 |
//h1,//h2,//h3 |
| 所有的P节点 | <p> |
p |
//p |
| p节点的所有子节点 | <p>标签下的所有节点 |
p > * |
//p/* |
| 查找所有包含attr属性的li标签 | <li attr="~"> |
li[attr] |
li[@attr] |
| 查找所有attr值为value的li标签 | <li attr="value"> |
li[attr=value] |
//li[@attr=‘value‘] |
| 查找id值为item的所有div节点 | <div id="item"> |
div#item |
//div[@id=‘item‘] |
| 查找class值中包含foo的所有标签 | <* class="foo blahblah"> |
.foo |
//*[contains(@class,‘foo‘)] |
| 第一个P节点 | 众多<p>中的第一个 <p> |
p:first-child |
//p[1] |
| 第n个P节点 | 众多<p>中的第n个 <p> |
p:nth-child |
//p[n] |
| 拥有子节点a的所有P节点 | <p><a></p> |
css无法实现 | //p[a] |
| 查找文本内容是“Web Scraping”的p节点 | <p>Web Scraping</p> |
css无法实现 | //p[text()="Web Scraping"] |
