第n-的型CSS选择(nth-of-type css selector)

2019-08-07 03:57发布

下面是我的HTML页面的一个片段:

<td id="Platinum" align="center" width="16%">
    <div></div> 
    <a>link1</a>
</td>
<td></td>
<td id="Platinum" align="center" width="16%">
    <div></div>
    <a>link2</a>
</td>
<td id="Platinum" align="center" width="16%">
    <div></div>
    <a>link3</a>
</td>

在这里我要选择具有ID =“白金”第三TD元素

我的尝试是driver.findElement(By.cssSelector("#platinum:nth-of-type(3)"));

driver.findElement(By.cssSelector("td[id='platinum']:nth-of-type(3)"));

两者都不能正常工作如何选择与第三方TD任何想法id='platinum'

Answer 1:

存在空td不具有的ID,其与所述干扰:nth-of-type()计数。 所述选择器装置“第n td元素”,而不是“第n td与元件id='platinum' ”。 第三td具有该ID是实际上因此第四td整个排。

这是不可能选择第三个td使用CSS选择某个ID的元素。 你应该使用XPath来代替:

driver.findElement(By.xpath("//td[@id='Platinum'][3]"));


Answer 2:

那么首先。 你不能老是有几个ID同名。 你应该使用类。 然后,你可以再次使用同样的方法,但使用类尝试。 该代码将是这样的:

<td class="Platinum" align="center" width="16%">


Answer 3:

我想补充,如果你在JQuery中尝试这个,你可能会得到相同的结果。 该“#ID”可能的快捷方式要使用的将只与ID返回的第一个元素的document.getElementById()函数,如ID是指在给定的文档中唯一。



文章来源: nth-of-type css selector