Webdriver 定位页面元素方式

网页自动化最基本的要求就是要定位到各个元素，然后才能对该元素进行各种操作（输入，点击，清除，提交等），webdriver提供了一系列的对象定位方法，常用的有以下几种：

id选择器

HTML id属性 -- 唯一标识一个元素的属性。可能有以下几种原因使用到id属性

1、想链接到一个页面的指定位置

2、要在某个HTML元素上使用特定的css样式

3、要为每个HTML元素使用script(比如javascript)

4、要区分两个相同的HTML元素

id属性在整个页面与CSS样式表中一定要是唯一的，在整个网站中最好也唯一。如

<input

id="kw" name="wd" class="s_ipt"

value="" maxlength="255" autocomplete="off"><--！百度搜索输入框-->

使用python代码定位上述id属性的元素

fromselenium import webdriver

browser=webdriver.Firefox()

browser.get("https://www.baidu.com")

browser.find_element_by_id("kw").send_keys('python') #通过id选择器定位，并在文本框输入python字符

注意点：有些id值是动态变化的，则不能使用该方法定位。如下：id就是动态的，每次进入页面，该id都会改变。

<label

style="display: block;" id="auto-id-1469758879170"

class="u-label f-dn">邮箱帐号或手机号

name选择器

name属性 -- 标识一个HTML元素的属性，可能有以下几种原因使用到name属性

1、使用meta标签

2、在表单中标识一个表单元素

3、使用在frame上定义其名字

W3C的XHTML1.0标准明确，在a、applet、form、frame、iframe、img、map元素中应弃用name属性，并明确在将来版本XHTML的上述元素中将删除此属性。W3C的XHTML1.0标准明确，唯一标记一个片段（fragment）应使用id，而非name。但考虑到对老式客户端浏览器的兼容可以按下列方式定义：

...

JavaScript需要HTML文档中的元素有一个唯一的名称，以便于访问这些元素，但是HTML标准中并没有明确name必须唯一，因此W3C发明了id属性，并明确其必须唯一。可惜的是，一些老式浏览器不支持id

为了提高兼容性我们目前仍需要在上述元素中使用name，同时部分元素仍需使用name，这些元素包括：button、input、meta、object、param、select、textarea。

<tr height="32px"><--!ITM用户名、密码框-->

</tr>

</tr>

使用python代码定位上述name属性的元素

fromselenium import webdriver

browser=webdriver.Firefox()

browser.get("https://10.203.10.51")

browser.find_element_by_name("usrname").send_keys('admin') #通过name选择器属性定位，并输入admin字符

browser.find_element_by_name("pass").send_keys('tc090331')

LinkText

这个方法比较直接，即通过超文本链接上的文字信息来定位元素，这种方式一般专门用于定位页面上的超文本链接。通常一个超文本链接会长成这个样子：

href="#" id="logout">退出

</li>

使用python代码实现点击退出按钮

logoutlink=browser.find_element_by_link_text("退出"); #点击“退出”链接按钮

logoutlink.click() #

注：因web使用utf-8编码，在python环境中，脚本应使用utf-8无BOM格式编码。

ClassName

ClassName属性是利用元素的css样式表所引用的类名称来进行元素查找的方法。对于任何HTML页面的元素来说，一般程序员或页面设计师会给元素直接赋予一个样式属性或者利用css文件里的类来定义元素样式，使元素在页面上显示时能够更加美观。

<input id="submit" value="登录" class="login_form_submit"tabindex="3" type="button">

<div><a

href="/main/license/index" class="forgot-password-link">更新授权

使用python代码实现点击登录按钮

fromselenium import webdriver

browser=webdriver.Firefox()

browser.get("https://10.203.10.115")

browser.find_element_by_xpath("//input[@tabindex=string(1)]").send_keys('admin')

browser.find_element_by_class_name("login_form_submit").click() #模拟点击登录按钮

使用className来进行元素定位时，有时会碰到一个元素指定了若干个class属性值的“复合样式”的情况，如下面这个button：

<button

id="J_sidebar_login" class=" btn_big btn_submit"

type="submit">登录</button>。

这个button元素指定了两个不同的css类名作为它的样式属性值

Ifyou try to find the element by CSS path as below.

driver.find_element_by_class_name("btn_bigbtn_submit")

Youwill get the error :

InvalidSelectorException:Message: invalid selector: Compound class names not permitted

Theissue is because of the way find by Class name works.in your code class nameis class="btn_big btn_submit"

Asright now selenium doesn't support multiple class name.If your class nameincludes a space, WebDriver will see it as a "compound selector". Youcan simply get rid of the issue by using Id, CSS, Xpath, regular expression orany other element finder method.

You can use

driver.find_element_by_class_name("btn_big")

driver.find_element_by_class_name("btn_submit")

youcan select anyone class name from two or more class names separated by spaces ,it'llwork just fine.

XPath路径定位

XPath语言的核心是给出用于从XML文件中查找标记的语法规则，即编写XPath路径表达式，以便使应用程序更加方便、快捷地从XML文件中检索到所需要的数据。我们处理XML文档时可以一层层地查找所需的XML节点，在XPath路径中，我们使用反斜杠符号来分隔各个层次的XML元素的名称。

cssSelector

cssSelector这种元素定位方式跟xpath比较类似，但执行速度较快，而且各种浏览器对它的支持都相当到位，所以功能也是蛮强大的。

最后再总结一下，各种方式在选择的时候应该怎么选择：

1. 当页面元素有id属性时，最好尽量用id来定位。但由于现实项目中很多程序员其实写的代码并不规范，会缺少很多标准属性，这时就只有选择其他定位方法。

2. xpath很强悍，但定位性能不是很好，所以还是尽量少用。如果确实少数元素不好定位，可以选择xpath或cssSelector。

3. 当要定位一组元素相同元素时，可以考虑用tagName或name。

4. 当有链接需要定位时，可以考虑linkText或partialLinkText方式。