使用高级的CSS选择器定位元素

      之前已经学习了基本的CSS选择器 http://blog.csdn.net/adonis_lu37/article/details/76997138，这里我们将探索用一些高级的CSS选择器来定位元素。如相邻的兄弟结合伪类的使用。

查询子元素

<form id="loginForm">
	<label for="username">UserName:	</label> <input type="text" class="username"/></br>
	<label for="password">Password:	</label> <input type="password" class="password"/></br>
	<input name="login" type="submit" value="login"/>
</form>

如果想要定位表单中的用户名输入框，我们使用在父子元素间使用“>”符号

WebElement username=driver.getElement(By.cssSelector("form#loginForm > input"));

相似的使用nth-child( )方法也可以定位

WebElement username=driver.getElement(By.cssSelector("form#loginForm : nth-child(2)"));

下列表格列出了使用伪类来定位元素的例子

伪类	例子	描述
:first-child	form#loginForm : first-child	定位表单里第一个子元素，username标签
:last-child	form#loginForm : last-child	定位表单里最后一个子元素，login按钮
:nth-child( )	form#loginForm : nth-child(2)	定位表单里第二个子元素，username输入框

查询兄弟元素

使用CSS选择器，我们可以用“+”操作符来定位兄弟元素，以百度首页为例，可以使用下面的方法来定位百度导航栏上的“网页”超链接。

WebElement web=driver.getElement(By.cssSelector("#nv a + b"));

#nv a定位到“新闻”链接，“+ b”后就找到其兄弟<b>元素

使用用户操作伪类

使用用户的操作行为 :focus 伪类，定位焦点在input框中的元素，方法如下：

WebElement ProductDescription=driver.getElement(By.cssSelector("input：focus"));

你也可以使用 :hover 和 :active 伪类来定位元素

使用UI状态伪类

使用UI状态伪类，我们可以通过元素的各种状态来定位，如enabled，disabled，checked

下列表格给予了详细的说明

伪类	例子	描述
:enabled	input：enabled	定位所有属性为enabled的input元素
:disabled	input：disabled	定位所有属性为disabled的input元素
:checked	input：checked	定位所有多选框属性为enabled的元素