Robot Framework自动化测试-元素定位之css

有了前面介绍的id、name、xpath定位方式，对于平时需要使用的定位方式基本都能做到，接下来在介绍一个稍微有点难度的css定位。css定位灵活，方便，但需要有点点基础。
还是以百度搜索的为例做说明：

<html>
  <body link="#0000cc">
    <div id="wrapper" style="display: block;">
      <div id="content" style="display: block;">
      <div id="u1" style="display: block;">
         <div id="m">
             <p id="lg">
             <p id="nv">
             <div id="fm">
                 <form id="form" class="fm" action="/s" name="f1">
                     <span class="s_ipt_wr">
                         <input id="kw"  type="text" name="wd">
  ......

先看个表格吧，简单整理了下，以便说明：

选择器	例子	说明
*	*	通用元素选择器，匹配任何元素
E	div	标签选择器，匹配所有使用 E 标签的元素
.info class	.s_ipt_wr	匹配所有 class 属性中包含 info 的元素
footer id	kw	匹配所有 id 属性等于 footer 的元素
E,F	div,p	多元素选择器，同时匹配所有 E 元素或 F 元素，E 和 F 之间用逗号分隔
E F	div p	后代元素选择器，匹配所有属于 E 元素后代的 F 元素，E 和 F 之间用空格分隔
E > F	div>p	子元素选择器，匹配所有 E 元素的子元素 F
E + F	p+div	毗邻元素选择器，匹配紧随 E 元素之后的同级元素 F （只匹配第一个）
E ~ F	p ~ div	同级元素选择器，匹配所有在 E 元素之后的同级 F 元素
E[att=’val’]	div[id=”kw”]	属性 att 的值为 val 的 E 元素（区分大小写）
E[att^=’val’]	div[id^=”kw”]	属性 att 的值以 val 开头的 E 元素（区分大小写）
E[att$=’val’]	div[id$=”kw”]	属性 att 的值以 val 结尾的 E 元素（区分大小写）
E[att*=’val’]	div[id*=”kw”]	属性 att 的值包含 val 的 E 元素（区分大小写）
E[att1=’v1’][att2*=’v2’]	form[id=”form”][class=”fm”]	属性 att1 的值为 v1，att2 的值包含 v2 （区分大小写）
E:contains(‘xxxx’)		内容中包含 xxxx 的 E 元素
E:not(s)		匹配不符合当前选择器的任何元素
E:nth-child()	div:nth-child(1)	找他的子元素，括号中的数字从1开始
E:first	div:first	在其父元素中的E子元素集合中排在第1个的E元素
E:last	div：last	在其父元素中的E子元素集合中排在最后1个的E元素

上面的表格中基本涵盖了平时所用的所有定位方式

Robot Framework自动化测试-元素定位之css

猜你喜欢