包含类、子选择器和相邻兄弟选择器的 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

标签： css xpath css-selectors

【解决方案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&amp;p=2">
                        2
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=3">
                        3
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=4">
                        4
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=5">
                        5
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=6">
                        6
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=7">
                        7
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=8">
                        8
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=9">
                        9
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=10">
                        10
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=11">
                        11
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=12">
                        12
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=13">
                        13
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=14">
                        14
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=15">
                        15
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=16">
                        16
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=17">
                        17
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=18">
                        18
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=19">
                        19
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=20">
                        20
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=21">
                        21
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=22">
                        22
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=23">
                        23
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=24">
                        24
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=25">
                        25
                    </a>
                </li>
                <li class="current ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=26">
                        26
                    </a>
                </li>
                <li class=" ">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=27">
                        27
                    </a>
                </li>
                <li class="last">
                    <a href="/forum-replies.cfm?t=1543353&amp;p=-1&amp;#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 查询的第一个匹配项。