影刀RPA新手教程：选择器工具完全指南——元素捕获录制模式与手工编写XPath的区别

影刀RPA新手教程选择器工具完全指南——元素捕获录制模式与手工编写XPath的区别作者林焱 | 元素定位踩坑无数这篇帮你少走弯路写在前面影刀RPA里最让人困惑的事情之一就是元素定位到底该用哪种方式。新手一般用捕获录制模式点哪里录哪里简单粗暴。但遇到网页结构复杂、元素属性动态变化的情况录制模式就不够用了。这时候需要手工编写XPath或CSS选择器精准定位元素。我刚开始学影刀的时候XPath完全看不懂一堆斜杠和方括号像天书一样。后来硬着头皮学了两周现在回头看这是学影刀最值得投入时间的一件事。这篇文章把录制模式和手工编写XPath的区别讲透带你彻底搞懂元素定位。模块一安装与选择器工具的入口影刀RPA安装完成后选择器工具就在指令区的网页自动化分类下面。获取元素对象指令就是选择器工具的核心入口。但更快的方式是按快捷键 CtrlShiftX直接启动元素捕获模式。捕获到元素后右键点击画布上的元素指令选择编辑元素就能打开元素编辑器。元素编辑器里可以看到影刀自动生成的定位方式也可以手动修改为XPath或CSS选择器。我当时找元素编辑器找了很久因为不知道要右键点击指令才能编辑元素。记住捕获只是第一步真正的精髓在元素编辑器里。模块二元素定位四合一——录制模式vs手工编写这是本文的核心内容详细对比两种方式的优劣。录制模式自动捕获优点简单、快速、不需要懂技术。操作步骤启动捕获 → 点网页上的元素 → 影刀自动生成定位规则 → 完成。影刀会自动分析元素的多个属性ID、class、tag、text、以及周围DOM结构。它会生成一个多条件组合的定位规则类似tagbutton AND text登录 AND parent-tagdiv这种多条件组合的方式在大多数简单场景下是够用的。缺点也很明显第一元素属性一旦变化定位就失效。比如网站改版后class名称变了。第二生成的定位规则很冗长可读性差出了问题不好排查。第三无法处理复杂的DOM关系比如找到包含特定文本的父元素下的某个子元素。手工编写XPath/CSS优点精准、稳定、灵活、可读性好。缺点学习曲线陡峭需要懂HTML DOM结构和XPath/CSS语法。但我负责任地告诉你XPath并不难掌握20%的语法能解决80%的问题。后面模块会详细讲XPath语法这里先给一个直观对比。录制模式生成的定位规则自动生成冗长tagbutton, attr-id, attr-classel-button el-button--primary, attr-text登录, parent-tagform, parent-classlogin-form手工编写的XPath简洁精准//button[contains(class,el-button--primary) and text()登录]哪个更好读、更好维护一目了然。模块三变量在元素定位中的高级用法元素定位不只是静态的还可以和变量结合实现动态定位。场景有一个循环每次迭代需要点击不同名称的按钮。比如列表里有编辑、“删除”、查看三个按钮根据当前状态只点其中一个。录制模式做不到这种动态定位因为录下来的元素是固定的。手工编写XPath配合变量就能轻松实现//button[text(){按钮名称}]店群矩阵自动化突破运营极限在影刀的元素编辑器里把XPath值设为变量引用比如//button[text() 按钮名称变量 ]另一个场景全局变量作为元素属性的一部分。根据前面提供的素材影刀支持在元素编辑中使用全局变量。操作方式编辑元素时点击属性值后面的 fx 按钮选择全局变量。这样元素的定位就和基础配置解耦了切换环境时只需要改全局变量的值。我当时做一个项目测试环境和生产环境的域名不同但页面结构完全相同。用全局变量存储域名部分元素定位规则只用相对路径一套流程跑两个环境不用改任何代码。模块四流程控制与元素等待元素定位和流程控制紧密结合很多时候定位失败是因为时机不对。常见错误网页还没加载完就去查找元素当然找不到。解决方案一在点击元素之前加一个等待元素存在指令。这个指令会轮询DOM直到元素出现或超时。解决方案二用FOR循环配合重新获取元素处理页面刷新的情况。根据素材里的经验如果操作时原网页刷新了之前捕获的相似元素会失效。正确做法是用FOR次数循环在每次循环内重新获取相似元素列表按下标取元素。代码逻辑示意获取相似元素列表保存到 list_elements FOR i 0 到 list_elements.length - 1 重新获取相似元素列表因为页面可能刷新了 取 list_elements[i] 进行操作解决方案三用WHILE循环配合获取元素列表长度处理动态列表。素材里提到的阿里发票案例点击同意后元素消失列表长度变化。正确做法是无限循环中每次都点列表第一个元素如果列表长度为0则退出。模块五网页自动化——实战案例贯穿全文用一个完整案例贯穿录制模式和XPath的对比。案例背景某电商后台需要批量处理订单点击每个订单的发货按钮。页面结构特点订单列表是动态加载的滚动到底部会自动加载更多每个订单的发货按钮没有固定IDclass是动态生成的点击发货后会弹出一个确认弹窗需要处理用录制模式尝试启动捕获点第一个订单的发货按钮影刀生成定位规则。规则大概是这样tagbutton, attr-classbtn-ship-1718192000, parent-idorder-12345问题来了class里的1718192000是动态时间戳每次刷新都变。parent-id 里的12345是订单号每个订单都不同。所以这个录制结果只能用于这一个按钮完全无法复用。改用XPath手工编写分析DOM结构后发现每个订单是一个tr标签发货按钮在这个tr下的第三个td里。XPath写法//tr[classorder-row]//button[contains(class,btn-ship)]或者用更稳定的文本定位//tr[classorder-row]//button[text()发货]这个XPath不依赖任何动态属性只要页面结构不变就能稳定定位。对比结论维度录制模式手工XPath上手难度低中高定位精准度一般高抗页面变化能力弱强| 可维护性 | 差 | 好 || 适用场景 | 简单固定页面 | 复杂动态页面 |模块六数据处理与元素文本提取元素定位的最终目的往往是获取元素上的文本或属性数据。获取文本内容用获取元素文本指令可以读取元素内的文字内容。但有时候文本不在元素的text里而在属性里比如data-price199。这时候要用获取元素属性指令指定属性名data-price来读取值。正则提取获取到文本之后往往需要做二次提取。比如商品价格文本是199.00 起需要提取出数字199。用正则匹配指令正则表达式写为(\d\.?\d*)提取出第一个捕获组。在元素定位中直接用正则根据素材内容影刀的元素编辑器支持正则表达式匹配属性值。语法示例^((?!active).)*$匹配所有不包含active的字符串。这个在做复选框状态判断时非常有用。模块七鼠标键盘图像与元素定位的配合有些元素表面上可以定位但点击没反应需要用物理点击。原因分析有些网站用Canvas渲染没有真实的DOM元素。有些网站对模拟点击做了防护需要用真实坐标点击。图像识别定位当所有DOM定位方式都失效时最后的手段是图像识别。影刀可以截取目标元素的截图然后在运行时在屏幕上搜索这个图像。找到后返回坐标位置再用鼠标点击坐标。图像识别的优点是不依赖DOM缺点是受屏幕分辨率和缩放影响。实战建议优先用XPath/CSS定位稳定性最好。XPath失效时用图像识别兜底不要一开始就依赖图像识别。模块八进阶技能——JS注入辅助定位有些场景下元素定位到了但无法触发预期的行为。比如点击按钮后网页没有任何反应因为网站的点击事件是绑在父元素上的。解决方案用JavaScript直接触发事件。在影刀里用在网页元素上执行JavaScript指令注入以下代码function(element,input){// 触发原生点击事件element.click();// 或者触发自定义事件vareventnewMouseEvent(click,{bubbles:true});element.dispatchEvent(event);returntrue;}另一个场景元素被CSS隐藏了display:none无法直接点击。用JS修改样式后再点击function(element,input){element.style.displayblock;element.click();returntrue;}模块九平台实战——完整订单处理流程把前面所有知识串起来完整走一遍电商订单批量发货的流程。需求登录电商后台翻页加载所有待发货订单逐个点击发货按钮处理确认弹窗最后导出处理结果。第一步登录用录制模式捕获账号密码输入框和登录按钮。这部分页面结构简单稳定录制模式完全够用不必过度设计。第二步等待订单列表加载用等待元素存在指令等待订单列表的第一个订单行出现。超时设为30秒如果超时说明页面加载异常记录错误日志并退出。第三步处理动态加载订单列表有无限滚动需要模拟滚动到底部触发加载更多。用在网页上执行JavaScript注入滚动代码window.scrollTo(0,document.body.scrollHeight);滚动后等待新内容加载用等待元素存在等待新订单出现。第四步循环点击发货按钮用FOR循环遍历所有订单行。每行用XPath定位该行的发货按钮//tr[classorder-row][POSITION]//button[text()发货]注意这里的[POSITION]要替换为循环变量 i。temu店群自动化报活动案例第五步处理确认弹窗点击发货后会弹出一个确认弹窗用等待元素存在等待确认按钮出现。然后用XPath定位确认按钮并点击。第六步翻页当前页处理完后用XPath定位下一页按钮。如果按钮存在且不可点disabled状态说明已经是最后一页退出循环。模块十系统联动元素定位采集到的数据往往需要保存到本地或推送到其他系统。保存到Excel用数据表指令创建内存表每行存一个订单的处理结果。全部处理完后用写入Excel指令导出到文件。发送邮件通知处理完成后用发送邮件指令把处理结果Excel作为附件发送。调用API上传数据用发送HTTP请求指令把处理结果POST到内部系统的API接口。模块十一工程化规范当流程里大量使用XPath时需要做好规范管理。规范一XPath命名注释在元素编辑器的备注栏里写明这个XPath的定位逻辑。比如“定位订单列表中每行的发货按钮通过button文本发货来定位”。这样后续维护时不用重新分析XPath就能知道定位意图。规范二XPath统一风格团队内部统一XPath的编写风格。比如优先用text()定位其次用contains(class,)定位最后才用绝对路径。规范三元素版本管理网页改版后XPath可能失效失效前要留有备用定位方案。在元素编辑器里可以配置多个定位条件用或的关系组合。这样主定位方案失效时会自动尝试备用方案。模块十二速查表与常见报错XPath常用语法速查需求XPath写法说明根据ID定位//*[id‘xxx’]最精准但ID动态时不可用根据class定位//div[class‘xxx’]class有多个值时要用containsclass包含某值//div[contains(class,‘xxx’)]推荐用法根据文本定位//button[text()‘登录’]精确匹配文本文本包含某值//button[contains(text(),‘登录’)]模糊匹配取第N个元素(//tr[class‘row’])[N]注意括号父元素//td/…或用parent::语法子元素//tr/td直接子元素用/后代用//属性不包含某值//*[attr[not(contains(.,‘xxx’))]]高级用法多个条件//button[type‘submit’ and text()‘保存’]and/or组合CSS选择器常用语法速查需求CSS写法说明根据ID#xxx最简洁根据class.xxx只匹配单个class多class.a.b同时有a和b两个class根据属性input[type‘text’]属性精确匹配属性包含div[class*‘xxx’]推荐用法第N个子元素li:nth-child(N)从1开始最后一个子元素li:last-child常用父元素 直接子元素div p只匹配直接子元素常见报错排查报错信息原因解决方案找不到元素XPath语法错误在浏览器F12里测试XPath是否正确找不到元素元素在iframe里在元素编辑器里配置iframe路径元素不可点击被遮罩层覆盖用JS去掉遮罩或等待遮罩消失定位到错误元素XPath不够精准增加更多条件限定或改用更具体的定位方式偶尔能找到偶尔找不到页面加载时序问题加等待元素存在指令在浏览器F12里测试XPath的方法按F12打开开发者工具切换到Console标签页输入$x(你的XPath)并回车如果返回空数组说明XPath没匹配到任何元素如果返回数组有内容说明XPath正确示例$x(//button[text()登录])总结录制模式适合快速原型XPath适合生产环境。新手阶段可以多用录制模式但一定要逐步过渡到手工编写XPath。XPath的语法不需要全部记住把这篇文章的速查表保存好用的时候查就行。当你能熟练用手工XPath定位任何元素时影刀RPA就算真正入门了。更多XPath进阶技巧可以访问 home.linyan.cloud 查看专题文章。#影刀RPA #RPA教程 #XPath教程 #元素定位 #CSS选择器 #影刀新手 #RPA零基础 #网页自动化 #选择器工具 #影刀完全指南作者林焱