我正在尝试使用By.cssSelector来获取类c3的第n个dom元素,其结构如下：
<div class="c1">
<div class="c2">
<div class="c3">...</div>
</div>
</div>
<div class="c1">
<div class="c2">
<div class="c3">...</div>
</div>
</div>
<div class="c1">
<div class="c2">
<div class="c3">...</div>
</div>
</div>
测试我的CSS选择器,我变得越来越困惑.
此选择器正确选择c2 / c3的第二个实例：
.c1:nth-of-type(2)
而：
.c2:nth-of-type(2)
.c3:nth-of-type(2)
什么都不选.
更糟糕的是,将其翻译成硒,我似乎始终没有找到所有3个版本.有很多选择这些元素的替代方法(我可能只是做XPATH),但我对nth-of-type缺乏理解让我发疯.任何人都可以提供有关为什么第二个2不起作用或纠正我对这个选择器的基本缺乏理解的见解？
编辑：这已经在Chrome(29/30)和Firefox(24/25)
解决方法:
我并不确定你想要选择哪一个,但你应该使用：nth- *伪类来玩更多.这是一个CSS选择器,使用nth-child()选择所有3个c3
div.c1 div.c3:nth-child(1)
就像我说的,你还没有真正指定你想要选择哪一个.
but my lack of understanding on nth-of-type is driving me crazy. Can anyone offer insight to why the second 2 don’t work or correct my basic lack of comprehension on this selector?
要记住的一件事是：所有的：nth – *()伪类都依赖于他们的父母.让我翻译你的选择器：
.c1:nth-of-type(2)
Find anything with a class of c1 that is a second child.
在您的情况下,< body>很可能是父母,所以……
<body>
<div .c1 />
<div .c1 /> // it highlights this one, because it's the 2nd child of the type ".c1"
<div .c1 />
</body>
现在让我解释为什么你的其他选择器不工作.
.c2：nth-of-type(2)和.c3：nth-of-type(2)都在查看父类.因为你指定了一个父,所以它期待< body>作为父母.在您的情况下,< body>不是父… ..< div .c1 />是.实际上,该选择器正在寻找DOM –
<body>
<div .c1 />
<div .c2 /> // this **would** be the second nth-of-type, but it's not really this way.
<div .c1 />
</body>
在http://cssdesk.com处使用不同的css选择器和伪类,这对于自己进行主动实验非常有帮助.你会搞清楚的.
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
