包含类、子选择器和相邻兄弟选择器的 CSS 选择器的等效 XPath 是啥？
Posted
技术标签:
【中文标题】包含类、子选择器和相邻兄弟选择器的 CSS 选择器的等效 XPath 是啥？【英文标题】：What’s the equivalent XPath for a CSS selector containing a class, child and adjacent sibling selector?包含类、子选择器和相邻兄弟选择器的 CSS 选择器的等效 XPath 是什么？ 【发布时间】：2011-07-17 08:56:06 【问题描述】：我有这个：
li.current+li>a
但是我只有 XPath 的基本知识。 我需要它用于 AutoPager Firefox 扩展。
我也想只获得第一场比赛。
【问题讨论】：
xpath.alephzarro.com/content/cheatsheet.html 我已经看过了，但是你如何获得下一个兄弟姐妹？ 获得第一场比赛怎么样？ 我有 //[li[@class='current']/following-sibling::li[1]/a 【参考方案1】：如果您的li 属于多个类，那么...
//li[contains(concat(' ',normalize-space(@class),' '),' current ')]/following-sibling::*[1]/self::li/a
为了清楚起见，将同一件事分成多行：
//li[contains(
concat(' ',normalize-space(@class),' '),
' current '
)
]/following-sibling::*[1]/self::li/a
引用：http://pivotallabs.com/users/alex/blog/articles/427-xpath-css-class-matching
我使用以下 XML 对 Online XPath 2 evaluator 进行了测试：
<html>
<head>
<title>
Consume usage app support thread #2 - Apps - iPhone - Whirlpool Forums
</title>
</head>
<body>
<div id="root">
<ul id="top_pagination" class="pagination ">
<li class="first">
<a href="/forum-replies.cfm?t=1543353">
first: 5 months ago
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353">
1
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=2">
2
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=3">
3
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=4">
4
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=5">
5
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=6">
6
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=7">
7
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=8">
8
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=9">
9
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=10">
10
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=11">
11
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=12">
12
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=13">
13
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=14">
14
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=15">
15
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=16">
16
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=17">
17
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=18">
18
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=19">
19
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=20">
20
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=21">
21
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=22">
22
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=23">
23
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=24">
24
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=25">
25
</a>
</li>
<li class="current ">
<a href="/forum-replies.cfm?t=1543353&p=26">
26
</a>
</li>
<li class=" ">
<a href="/forum-replies.cfm?t=1543353&p=27">
27
</a>
</li>
<li class="last">
<a href="/forum-replies.cfm?t=1543353&p=-1&#bottom">
last: 2 hours ago
</a>
</li>
</ul>
</div>
</body>
</html>
您应该注意，您作为输入链接到的页面 - http://forums.whirlpool.net.au/forum-replies.cfm?t=1543353&p=26 - 是 HTML，而不是 XML：
其 doctype 声明适用于 HTML 4.01 文档包含未封闭的标签，例如<br>，必须是<br />
...所以你可能会在使用它作为 XPath 评估的输入时遇到问题。
【讨论】：
@Alejandro - 格式化/突出显示使 XPAth 看起来很奇怪；第一行看起来像注释...我将同时放置单行和多行格式。 我认为滚动最不利于可读性。此外，我们将空格处理作为 XPath 的一个特性... @Alejandro - 同意；真的我只是不喜欢 SO 语法高亮处理多行 XPath 的方式......我想知道是否有办法强制语法高亮显示使用特定的规则集？ 那是Google Code Prettify。它今天没有 XPath 支持。【参考方案2】：li.current + li > a 映射到：
//li[@class='current']/following-sibling::*[1]/self::li/a
如果你想选择第一个 a 子元素，你的 CSS 选择器应该是：
li.current + li > a:first-child
映射到：
//li[@class='current']/following-sibling::*[1]/self::li/a[1]
【讨论】：
谢谢，但它仍然匹配 2 而不是第一个。 获取此页面：forums.whirlpool.net.au/forum-replies.cfm?t=1543353&p=26 我正在将它用于 HTML。 我确实可以工作，并且无论如何都会忽略空格，类之间用空格分隔。但我希望 XPath 只选择第一个匹配项。 你的意思是只有第一个a子元素吗？因为您还需要更改 CSS 选择器。
不只是整个 XPath 查询的第一个匹配项。以上是关于包含类、子选择器和相邻兄弟选择器的 CSS 选择器的等效 XPath 是啥？的主要内容，如果未能解决你的问题，请参考以下文章