如何使用"not：“和"nth-of-type filter”过滤html标签cssselector webdriver

Question

让我们假设我在一个很大的HTML文件中有如下DOM结构：

<ul class="results">
    <li class="hai bye">Coffee</li>
    <li class="hai">Tea</li>
    <li class="hai bye">Milk</li>
    <li class="hai">Soup</li>
    <li class="hai bye">Soft Drinks</li>
</ul>

我想使用cssselector webdriver选择不包含类"bye“的第二个列表元素。

我试着把cssselector写成：.results li.hai:not(.bye):nth-of-type(%d)，它不能工作。

但是，如果我尝试编写cssselector，比如：.results li.hai:not(.bye)，它选择的是第一个列表元素"Tea“，它没有类"bye”。因此，nth-of-type不起作用。

我是否错误地使用了nth-of-type？请给我引路。

我需要的输出是选择"Soup“列表元素。

Answer 1

用.results li:nth-of-type(4) {}做汤。

Answer 2

您正确地使用了nth-of-type，但它将从li中获取第n个元素，而不是针对特定的类。您可以将xpath选择器用作//li[@class='hai'][2]。