blob: 3a786a812318bec05a960f2cbbbfe865b4330a74 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
---
title: Comparison of CSS Selectors and XPath
slug: Web/XPath/Comparison_with_CSS_selectors
translation_of: Web/XPath/Comparison_with_CSS_selectors
original_slug: Web/CSS/CSS_Selectors/Comparison_with_XPath
---
<div>{{CSSRef("Selectors")}}{{QuickLinksWithSubpages("/en-US/docs/Web/XPath")}}{{Draft}}</div>
<p class="summary">本文旨在记录CSS选择器和XPath之间的区别，以便Web开发人员能够更好地为正确的工作选择合适的工具。</p>
<table class="standard-table">
<thead>
<tr>
<th scope="col"><a href="/en-US/docs/Web/XPath">XPath feature</a></th>
<th scope="col"><a href="/en-US/docs/Web/CSS/CSS_Selectors">CSS equivalent</a></th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/ancestor"><code>ancestor</code></a>, <a href="/en-US/docs/Web/XPath/Axes/parent"><code>parent</code></a> or <a href="/en-US/docs/Web/XPath/Axes/preceding-sibling"><code>preceding-sibling</code></a> axis</td>
<td>{{CSSxRef(":has",":has()")}} selector {{experimental_inline}}</td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/ancestor"><code>attribute</code></a> axis</td>
<td><a href="/en-US/docs/Web/CSS/Attribute_selectors">Attribute selectors</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/child"><code>child</code></a> axis</td>
<td><a href="/en-US/docs/Web/CSS/Child_selectors">Child combinator</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/descendant"><code>descendant</code></a> axis</td>
<td><a href="/en-US/docs/Web/CSS/Descendant_selectors">Descendant combinator</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/following-sibling"><code>following-sibling</code></a> axis</td>
<td><a href="/en-US/docs/Web/CSS/General_sibling_selectors">General sibling combinator</a> or <a href="/en-US/docs/Web/CSS/Adjacent_sibling_selectors">adjacent sibling combinator</a></td>
</tr>
<tr>
<td><a href="/en-US/docs/Web/XPath/Axes/self"><code>self</code></a> axis</td>
<td>{{CSSxRef(":scope")}} or {{CSSxRef(":host")}} selector</td>
</tr>
</tbody>
</table>
|
