一,元素定位①优先级:首先选择id,其次选class,再就是根据其他唯一元素,在更加层级过滤定位,根据多属性定位,②首选CSS定位,在选XPATH定位
1.xpath定位
//* 获取当前网页全部元素
//*[@id='i1'] 定位id为i1的元素,@后面接属性名
//*[@placeholder='请通过ID定位元素'] 页面中所有元素都可以通过标签中唯一属性名来定位
//input[@placeholder='请通过ID定位元素'] 把*换为input,即可通过tagname可以缩减查找范围.
//input[@class='classname'] 通过class来定位元素
//div[@class='inner'][1] 定位到多个元素的情况下 , 可以通过角标来定位到哪一个元素 定位不到元素的情况下可使用该种方式(下标),弊端是维护成本高
//div[@class='driver'][1]/div[@class='inner'][1] 第一层为//div[@class='driver'][1],第二层为div[@class='inner'][1] ,多层之间链接用反斜杠/,逐层定位元素
//input[@class='classname' and @placeholder='请通过CLASSNAME定位元素'] 多元素定位用and 连接
2.document:document obj modle 文档对象模型,把看到的HTML代码变为一个对象
JS:是一种脚本语言,给页面增加逻辑,通过dom来完成对页面的操作
JQ和DOM的区别,jq根据id获取元素简单,对dom进行封装,使用起来更加简便
xpath:通过路径解析页面,是一个缩减范围的过程,解析的是xml
三,CSS定位:css selector解析的是html,比起xpath更加快捷,不支持角标定位
定位方式和html选择器一样
#i1:定位id直接用#(#id值)
.classname:定位class用.
input:定位标签直接输入标签名
input[placeholder="请通过ID定位元素"]:单元素定位,注意和xpth的区别没有@号
select[size="4"][multiple="multiple"]:多元素定位直接加上[][]加上就行,注意也没有@号
body>div[id="basebody"]: 逐层定位使用大于好>,注意层级中必须使用属性
2.css.selector定位 略简单与xpath
#i1 直接定位到id为i1的元素位置
.classname 直接定位到class等于chassname的元素,注意前面的点
[name="name"] 单属性定位,元素中有name="name"可直接定位
[name="name"][type="text"] 多属性定位
input[name="name"] 同样可在前面加上标签缩减定位范围
input[placeholder^='请通过'] 模糊开头匹配,注意上尖角号
input[placeholder$='元素'] 模糊结尾匹配,注意$号
input[placeholder*='元素'] 模糊全匹配,注意*号