Question

<button id="createDropdown" class="btn-create" tabindex="7">
<ul id="createDropdownUl" class="dropdown-create" style="display: block">
<li tabindex="8">
<button>BOOK MASTER SERVICE </button>
</li>
<li tabindex="9">
<button> CREATE SCHEDULE</button>
</li>
</ul>
</div>

我想选择带有文本“CREATE SCHEDULE”的按钮。表达式的xpath是;

//*[@id='createDropdownUl']/li[2]/button

我尝试过以下代码。 ;

 WebElement menuitem=driver.findElement(By.cssSelector("ul#createDropdownUl>li>button"));

但是它选择了两个按钮我只想通过CSS选择器选择第二个按钮“CREATE SCHEDULE”。

Answer 1

attribute selector?

ul#createDropdownUl>li[tabindex="9"]>button

或者如果你想要最后一个，你可以使用:last-child：

ul#createDropdownUl>li:last-child>button

Answer 2

如果您确定tabindex，则可以使用attribute selector：

#createDropdownUl li[tabindex='9'] button {
    font-weight: bold /*Sample CSS*/
}

演示：http://jsfiddle.net/GCu2D/1171/

或者，如果您确定li元素的数量，您还可以使用：

#createDropdownUl li:nth-child(2) button{color:red;}

演示：http://jsfiddle.net/GCu2D/1172/

Answer 3

您可以通过CSS中的元素来定位元素：

#createDropdownUl li[tabindex="9"] button

或使用nth-child(x)选择器：

#createDropdownUl li:nth-child(9) button

CSS中没有其他方法，除非你给它一个ID。

Answer 4

我认为为您要调用的按钮分配ID是有帮助的，可以单独识别它们。

WebElement menuitem=driver.findElement(By.cssSelector("#MasterS"));

然后

{{1}}

Answer 5

在标准css中，这将是：

button button

但是你必须小心其他页面，它也可以选择第3，第4等等。

也就是说，标准css中没有普通性 - 只有类和id以及它们的层次结构级别（父/子）关系，与xpath不同。

什么可能是以下HTML源的CSS选择器

5 个答案: