使用XPath选择CSS类

使用XPath选择CSS类

我想写这个问题的规范答案，因为上面的答案有问题。

我们的问题

该 CSS 选择器：

.foo

将选择具有 foo 类的任何元素。

您如何在XPath中做到这一点？

尽管XPath比CSS强大，但是 XPath没有CSS类选择器的本机等效项 。但是，有一个解决方案。

正确的做法

XPath中 的等效选择器是：

//*[contains(concat(" ", normalize-space(@class), " "), " foo ")]

该函数对空格进行归一化处理，以去除前导和尾随空格（并且还将空格字符序列替换为单个空格）。

（从更一般的意义上讲）这也等同于CSS选择器：

*[class~="foo"]

它将匹配任何其 类 属性值是由空格分隔的值的列表的元素，其中一个值与 foo 完全相等。

几种明显但错误的方法

XPath选择器：

//*[@]

不起作用！例如，因为它不匹配具有多个类的元素

<div >

如果在类名周围有多余的空格，它也将不匹配：

<div >

“改进”的XPath选择器

//*[contains(@class, "foo")]

也不行！因为它错误地将元素与 foob​​ar 类匹配，例如

<div >