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用户名、密码框-->

<td width="178px"><input name="usrname" class="style4" maxlength="25" tabindex="1" type="text"></td>

</tr>

<tr height="31px">

<td><input name="pass" class="style4" maxlength="25" tabindex="2" autocomplete="off" type="password"></td>

</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

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

<a

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")

or

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方式。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。