
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        html {
            height: 100%;
        }
        body {
            height: 100%;
        }
        .container {
            height: 100%;
            background-image: linear-gradient(to right, #fbc2eb, #a6c1ee);
        }
        .login-wrapper {
            background-color: #fff;
            width: 358px;
            height: 588px;
            border-radius: 15px;
            padding: 0 50px;
            position: relative;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }
        .header {
            font-size: 38px;
            font-weight: bold;
            text-align: center;
            line-height: 200px;
        }
        .input-item {
            display: block;
            width: 100%;
            margin-bottom: 20px;
            border: 0;
            padding: 10px;
            border-bottom: 1px solid rgb(128, 125, 125);
            font-size: 15px;
            outline: none;
        }
        .input-item:placeholder {
            text-transform: uppercase;
        }
        .btn {
            text-align: center;
            padding: 10px;
            width: 100%;
            margin-top: 40px;
            background-image: linear-gradient(to right, #a6c1ee, #fbc2eb);
            color: #fff;
        }
        .msg {
            text-align: center;
            line-height: 88px;
        }
        a {
            text-decoration-line: none;
            color: #abc1ee;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="login-wrapper">
            <div class="header">微信</div>
            <div class="form-wrapper">
			<!-- <div > -->
                <input type="text" name="username" placeholder="用户名" class="input-item">
                <input type="password" name="password" placeholder="用户密码" class="input-item">
                <div class="btn">登录</div>
            </div>
            <div class="msg">
                没有账户?
                <a href="#">注册</a>
            </div>
        </div>
    </div>
</body>
</html>

3. 网页定位元素时对属性及其它条件的简单理解

3.1 id属性：可以类比为人的身份证，具有唯一性

优点: 通常是唯一的，定位精准。
使用场景: 元素有唯一的ID属性时，首选使用ID进行定位。

3.2 class属性：就像衣服，用于装饰

优点: 适用于多个相同类型的元素。
缺点: 可能不唯一，需要结合其他属性使用。
使用场景: 元素没有唯一ID，但有类名且类名能准确区分目标元素，同时需配合其他条件一起使用。

3.3 index：就像书的页码，用于定位

3.4 innerText：就像书里的内容

3.5 type：类型，如文本输入框通常为text，按钮通常为button

3.6 xpath：可以把它看作是在文档中指定一个路径，告诉浏览器或程序去找到你想要的内容

优点: 可以精确定位元素，无需元素有特定的ID或类名。
缺点: 结构变化时容易失效，复杂的XPath表达式可能影响性能。
使用场景: 复杂页面结构中，其他属性不能唯一定位元素时使用。

如我在班级里需要找到小明同学，我直接叫名字的话，容易重名找出两个甚至更多的小明。这个时候我就通过小明在班级里的位置加上小明今天穿的衣服及小明的名字来确认我需要找的人。同时也需要层级关系，如在那个市那个县那个学校。这样便可以通过多个条件形成唯一性来确认我需要找的人。也可以通过身份证的唯一性直接寻找

元素也一样，如此处的登录按钮，通过如下条件，便可实现元素的唯一性确认(元素具体定位还需具体分析，此处为理解元素层级关系选取了较多元素信息)

4. 选择合适的属性定位元素

在影刀RPA中定位元素时，选择合适的属性非常重要，以确保流程的稳定性和可靠性

为了提高定位的稳定性，可以采用组合策略，使用多个属性进行定位。例如：

class与innerText

class与id

若同一个网页元素较多容易重复，可多条件配合使用，如：class与index还有innerText

三、搭建影刀机器人注意事项

以影刀商城页面为讲解过程：

1. 捕获的元素命名：

为了后续方便自己及他人维护，元素名需按当前捕获的元素信息命名

2. 编辑元素信息

元素捕获后为了机器人的稳健运行一般需要编辑元素信息，通过合适的条件来定位元素，即使网站更新选取的条件也能再次捕获到。而编辑中容易变更的元素属性信息，一般不选取，选取不易变更的属性信息，如此处查询按钮，该按键为按钮类型一般不会变更，所以为按钮的属性就必选

3. 元素精准定位，保证机器人的稳健

3.1如此处两个输入框，需要第二个输入框，所以我的index(下标)为2，但因为html代码中是从0开始计算的，所以第二个位置的下标在代码的位置为1。而当前输入框的类型为text，所以勾上text，此时便可通过元素位置及类型来确认需要查找的元素

3.2 通过下标定位元素，下标一般配合其他元素使用，在列表中一般tr为行，td为列

如此处的确认发货在列表中位于第一行，第六列的位置，便可通过tr为0，td为5与内容为确认发货的信息来确认此位置的元素

4.元素被遮挡，元素被隐藏，元素出现消失等问题

4.1 元素被遮挡，此处客服名称被遮挡，若执行定时任务时，此处被完全遮挡，直接点击会点击到遮挡元素，出现错误。解决方法为捕获元素后点击高级，关闭模拟人工点击即可

4.2 元素被隐藏，如此处的影刀魔方，若工作台为关闭状态，则无法点击到，所以点击此影刀魔方前可以加个判断，如果当前工作台为关闭状态，则点击一下。

4.3 等待元素(图片)出现消失

如点击生成报表后会有个圈圈一直在转，必须等待圈圈消失后才能点击导出报表功能，若加等待时长影响机器人运行效率，且容易出现等待时长已到，而圈圈还在转等问题。所以此处使用等待图片消失功能，若图片消失，才点击导出报表

5 捕获悬停元素

即捕获元素时，元素消失，此时使用 ctrl+shift+单击鼠标左键即可捕获悬停元素

四、运行中元素常见出错问题

1. 网络异常

网络加载异常，网页未加载出来，却已开始执行点击元素操作

2. 网页更新

网页更新导致元素位置元素信息等元素属性更变，根据报错提示行，在机器人中找到当前行，点编辑元素，再校验元素，若提示未找到元素，重新捕获即可

3. 下载异常

需去谷歌浏览器设置把下载前询问每个文件的保存位置，下载完成后显示下载内容打开

五、编写机器人过程中常用小技巧

1. 根据条件拆分字符串

变量日期=2024-06-25，日期根据条件 - 拆分开，拆分后为多个值，

需用列表来接收，使用日期.split("-")

此处使用了python的代码功能，因此需要点亮python格式，才能生效

若拆出的月份06只想要6，只需用int()进行格式转换，把字符06转换成整数类型

2. ForEach列表循环

依次拿出列表中的值，可以用ForEach列表循环功能，此功能也不难理解，可以理解为一个袋子里装了多个苹果，我每次从中拿出一个，直到拿完为止，因为每次拿苹果都为重复性动作，所以可用循环

2.1 if条件判断

如果条件满足，则执行if里的指令，否则，则不执行，此处循环列表元素，if条件判断，如果循环到的值为2024，则打印出来

2.2退出循环

通常配合if使用，如循环1 2 3 4 5的值，若只想要1 2 3 的值，那么执行到4时，就可以退出循环了，可以理解为停止当前循环

2.3 继续下一次循环

通常配合if使用，如循环1 2 3 4 5的值，若只想要1 2 4 5 的值，那么就是不要3这个值，则加个条件判断，如果循环到的值为3，则跳过，此功能可以理解为跳过当前循环

3. 获取列表中某个位置的数据

4. 字符串截取

0 1 2 3 4 5 6

这是一段字符串

需点亮python表达式

六、xpath方式定位元素

如需深入了解，可查看并学习此文章：史上最全的xpath定位方法全在这了!_xpath last-CSDN博客

深入了解xpath前需先学习html，了解网页的构成及网页属性。

此处仅做简单了解，不深入讲解

1. 绝对路径与相对路径的理解

1.1绝对路径：明确地指出文件或目录在整个文件系统中的位置

xpath定位中绝对路径用 //表示

1.2相对路径：相对于当前工作目录的路径。它不从根目录开始，而是基于当前工作目录的位置

xpath定位中相对路径用 /表示

2.获取路径并执行

查看网页代码构成，在当前网页按 F12 ，再点击快捷键 ctrl+shift+c，再点击需要定位的元素，即可在网页代码中查看到当前元素的代码

对着当前行鼠标右键复制完整xpath，即可获得当前元素的绝对路径，熟悉后也可以直接手动编写路径

对着当前行鼠标右键复制xpath，即可获得当前元素的相对路径，熟悉后也可以直接手动编写路径

获取相对路径后为了稳定运行需更改路径信息，可通过class来定位元素

通常使用相对路径来定位元素，节省编辑时间

//*[@id="reload_rpt"]//span[@class='btn_search' and text()='生成报表']

运行如下程序，便可成功点击生成报表按钮

七、操作用例简单讲解

1. 影刀商城抓取网页列表所有页数据并写入Excel表里

抓取的网页为：https://shop.yingdao.com/list/table-list

编写机器人步骤如下

机器人获取链接：影刀应用分享: 商城列表数据抓取

2. 聚水潭简单操作流程，信息录入

聚水潭网页：聚水潭ERP

机器人步骤

机器人获取链接：影刀应用分享: 聚水潭商品信息重量录入

八、使用规范

1.建立分组与机器人命名

当需要给公司每个部门开发机器人时，每个部门需建立对应的分组，新建机器人便可放在对应的分组里，方便查找，防止混乱

机器人命名需与功能相关联，如需每天在聚水潭网页执行商品数据更新操作的机器人，命名为：

聚水潭商品数据更新

2.操作网页与软件

操作网页的指令为web，软件的指令为win，不可选错

3.操作网页与软件常用指令

网页

桌面软化

4.定时任务

1.1机器人如果需要走定时任务，需要先发版

注意：若发版后还需要更新修改机器人，更新后需要再次发版，此时定时任务才能执行更新后的机器人

1.2 新建定时任务，按照如下步骤，确定后即可每天正常执行

注意：执行时，需电脑处于开机运行状态，且运行时不能编辑机器人

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/930511