# UI自动化元素定位方式
***注意*：精准定位元素必须找到唯一值，例如id，或者多层class定位出的唯一元素值，否则极有可能定位不准，执行失败**
网页按F12可调出网页代码，点击代码窗口按control+F使用代码查找框，可输入id，css，xpath定位元素
## -------------------***以下正式内容，例子+示例定位+格式***--------------------
## #定位元素——ID
1 - css定位：div#app 2 即：标签#XX 3 4 - xpath定位：//div[@id="app"] 5 即：//标签[@id="XX"]
## #定位元素——class：
1 - css定位：div.app-wrapper.openSidebar 2 即：标签.XXX.XXX（class包含多个字符串，空格用.替代） 3 4 - xpath定位：//div[@class="XXX XXX"] 5 即：//标签[@class="XXX XXX"] （class包含多个字符串，直接复制即可，空格即空格）
## #定位元素——text文本
1 xpath定位：//span[text()="搜索"] 2 即：//标签[text()="XX"]
## #特殊标识定位——placeholder
1 其余特殊标识也一致 2 - css定位：input[placeholder=请选择环境] 3 即：标签[标识=XXX]（不需要加引号） 4 5 - xpath定位：//input[@placeholder="请选择环境"] 6 即：//标签[@标识=“XXX”]
## #多个标识定位一个元素：
1 - css定位：input.el-input__inner[placeholder=请选择环境] 2 即：标签.XXX[标识=YYY] 3 4 - xpath定位：//input[@class="el-input__inner" and @placeholder="请选择环境"] 5 即：//标签[@class="XXX" and @标识="YYY"]
1 - xpath定位：//a[@class="label-button a-primary" and text()="详情"] 2 即：//标签[@标识="XXX" and text()="YYY"]
## #相邻两层定位（即父子层）：
- css定位：div.el-table__body-wrapper.is-scrolling-none>table.el-table__body
即：父层定位>子层定位（以尖括号“ > ”引出子元素）
- xpath定位：//div[@class="el-table__body-wrapper is-scrolling-none"]/table[@class="el-table__body"]
即：//父层定位/子层定位（以单斜杠“ / ”引出子元素）
#### 相对位置定位（定位父层下的第N个子层）：
- xpath定位：tr[@class="el-table__row"]/td[position()=1] （第一个子层）
或：tr[@class="el-table__row"]/td[2] （第二个子层）
## #隔层定位（祖孙层或者更多跨层）：
- css定位：div.el-table__body-wrapper.is-scrolling-none tr.el-table__row
即：祖先层 子孙层（中间空格隔开即可）
- xpath定位：//div[@class="el-table__body-wrapper is-scrolling-none"]//tr[@class="el-table__row"]
即：//祖先层//子孙层（双斜杠隔开即可）
浙公网安备 33010602011771号