突然发现这个编辑器里面的*有时间显示不出来,好尴尬,这个定位方法和上个css那个还有好多地方用到,最好看截图里面表达式的写法,外面的只是解释一下
说过了css接着再说说xpath,还是需要大量的截图,xpath定位和电脑里的文件路径差不多如:html/body/div就是html下的body下的div元素
乍一看是不是和电脑里面的文件夹差不多,其实就是差不多,一层一层的往下写,这个是绝对路径
‘/’代表的是只能是上层元素的子元素,不包括后代元素
再看下面这个
html/body//div ‘//’这个意思是body下的所有的div元素后代,而第一幅图代表的仅仅是body下的子元素,定位时间如果仅仅靠这样定位那么是很麻烦的,所以xpath也有一些其他的用法,可以使定位元素更加方便,还是看图
上面的两个就是通过元素定位,这个方法和css里面差不多,不一样的是这个在中括号里面加了@符号 //*意思是html下的所有元素
//[contains(@data-tid,‘20’)]这个表达式意思是data_tid包含20的所有元素,下面还有一个,没发出来截图
//[starts-with(@data-tid,‘20’)]表达式的用法是找到data_tid属性值以20位开头的元素,这个就不在截图了,可以自己尝试下
//[@id=“wrapper”]/div[1]这个意思是定位所有id="wrapper"的元素下的第一个div子元素,这个方法是以后在用时经常用到的方法,也是一个十分好用的方法,基本上这个方法可以定位到所有的元素
//[@id=“wrapper”]/[2] 这个用法就比较有意思了,意思是所有id="wrapper"元素下的第二个子元素,不指定这个元素的标签就是单纯的第二个元素
//[@id=“wrapper”]/[last()]这个是指所有id="wrapper"元素下的最后一个元素,要是last()-1就是倒数第二个元素
//[@id=“wrapper”]/[position()<last()] 意思是指所有id="wrapper"元素下除了最后一个子元素外的所有元素 //[@id=“wrapper”]/[position()=1]和直接里面放下标1的用法一样,不过加上他多了一个大于或者小于的用法,这个是以后可能用到的
//[@id=“wrapper”]|//[@id=“s_upfunc_menus”]这个定位发现2个定位之间加了一个‘|’这个用法和css里面的‘,’差不多,就是同时定位id="wrapper"的所有元素和id=“s_upfunc_menus”]的所有元素,后面可以一直叠加css那个‘,’也可以一直叠加
最后说一下相邻元素的定位
//[@id=“s_is_index_css”]/following::div 这个表达式一共定位到了311个元素,意思是定位所有id="s_is_index_css的元素相邻的所有div元素(不包括他的后代元素),只是他后面的除了他的后代元素的div元素
//*[@id=“s_is_index_css”]/following::div[2],定位与他相邻的第二个div元素,如下图
/*[@id=“s_is_index_css”]/following-sibling::div此时只定位到了一个元素,原因是加了-sibling,此时定位的是和id="s_is_index_css"的元素的同级的所有div元素,因为此时只有一个同级的div元素,所以只定位了一个,如果有很多个那么就能定位到很多个同级兄弟元素,此时也可以用下标去找到元素
好了,今天到此为止
///a[contains(@href,‘diannao’)] ///a[contains(@text(),‘你好’)] ///a[contains(@href,‘diannao’)]/… .///label[@for=‘newstitle’]/…/input[@id=‘newstitle’]