艺赛旗RPA开发技巧-巧用css selector

一、什么是css selector

1. css selector指的是css 选择器，是用来匹配网页中的dom元素的。
2. 在艺赛旗设计器中，对IE浏览器上的元素，我们可以根据css selector定位，Chrome Google浏览器则是另外一种匹配规则(键值对，包括css selector，xpath, aaname等)，我们要根据实际情况选择有利于开发的浏览器。
3. 大部分时候设计器可以自动拾取到我们所需元素的查找路径，但我们要了解css selector的用法以及功能才能进行进阶的操作。
4. 学习资料：https://www.w3school.com.cn/cssref/css_selectors.asp

二、巧用selector

1. 找规律

大多数整齐排列的元素的selector都是有规律可循的，例如我们拾取百度的顶部导航栏时。

这里我们拾取了前三个元素（新闻，hao123，地图），路径分别为：

'body > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > A:nth-of-type(1)'
'body > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > A:nth-of-type(2)'
'body > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > A:nth-of-type(3)'

我们不难发现只有路径最后的一个数字不同，其他都是一样的。这里我们可以将该数字用变量i代替，并进行字符串拼接。
例如：

'body > DIV:nth-of-type(1) > DIV:nth-of-type(1) > DIV:nth-of-type(3) > A:nth-of-type('+str(i)+')'

这样，当我们改变i的值的时候，就可以获得不同的元素的路径，然后再选择相应的操作。

2. 对隐藏域中的元素进行操作

当表单使用的某些前端框架时，实际传递到后台的值是在隐藏域中的值，而隐藏域中的元素是无法用设计器进行拾取的。
这里我们对表单设置文本，用设计器直接拾取，然后赋值运行。

运行后结果如下：

我们会发现即使设置文本成功，表单上也有成功显示我们设置的值，但是实际传入到后台的值依旧为空，原因很简单，我们打开开发者工具拾取后发现，在所拾取的input框后还紧跟着一个在隐藏域中的input，我们发现该input的name属性是有值为’email’的，而实际传入到后台的值也正是该在隐藏域中input的value。

知道了原因后我们就对症下药，知道css selector语法规则的话可以自己写查找路径，然后直接对隐藏域中的input进行赋值，这样就成功设置了需要传入后台的值。

同理我们也可以对某些日期控件进行设置。