开发者社区> 问答> 正文

快速获取天猫商品价格

码栈可视化开发实例教程-快速获取天猫商品价格


码栈提供的可视化编程是面向无编程经验的开发者,它提供了通过拖动的方式实现应用逻辑的功能。 开发者不需要再关注编程语法、运行环境以及复杂的API,只需要按照流程拖动滑块并将其拼接在一起即可。

可视化编程界面主要分为`工具箱`、`画布区`两个部分,`工具箱`中包含开发者可能用到的所有命令,选中需要的滑块将其拖动到`画布区`即可。详细介绍请[点击这里]


本教程将通过`天猫搜索`的应用实例来为大家讲解可视化的使用方法,内容包括基础应用、使用参数面板、使用数据视图、使用循环和判断

第一节:基础应用

1. 在右侧的浏览器输入 www.tmall.com,然后输入回车


2. 拖动`打开网页`到画布区,并在配置对话框中修改打开网址为"www.tmall.com",点击确定


3. 拖动`填写输入框内容`到画布区,并在配置对话框中修改输入内容为"电视"


4. 点击`捕获网页元素`,在弹出的录制控件中点击`开始录制`,然后在右侧浏览器中选择"天猫搜索框",点击保存并关闭录制控件窗口


5. 拖动`点击网页元素`到画布区,点击`捕获网页元素`,在弹出的录制窗口中点击`开始录制`,然后在右侧浏览器中选择"天猫搜索按钮",点击保存并关闭录制控件窗口


6. 点击`保存`,切换到`执行预览`并点击`开始`按钮运行应用

第二节:使用参数面板

上例中我们使用“电视”作为搜索关键字,如果想在运行时动态的修改关键字就需要使用`参数面板`的功能。码栈通过`参数面板`来实现运行时的自定义内容
下面我们将通过`参数面板`来实现自定义搜索内容


1. 在`参数面板`中添加一个名称为"关键字"的参数


2. 拖动`读取参数面板`到画布区,将其放置到`打开网页`的下面;配置`参数名称`为"关键字",点击确定


3. 双击`填写输入框内容`,在弹出的配置对话框中修改`输入内容`,选择名称为"参数值"的动态内容,点击确定


4. 点击`保存`,切换到`执行预览`;在`关键字`中输入"洗衣机",并点击`开始`按钮运行应用




第三节:使用数据视图
`数据视图`主要用于保存运行结果及数据导入、导出,本节将通过保存运行结果来介绍`数据视图`的使用方式



1. 在`数据视图`中添加一个名称为"商品名称"的列


2. 拖动`定时器`到画布区,并点击确定。由于天猫搜索结果是延迟加载的,所以此处需要添加`定时器`,实际开发中不一定需要


3. 拖动`获取网页元素内容`到画布区,点击`捕获网页元素`,在弹出的录制窗口中点击`开始录制`,将鼠标移动到商品名称位置并点击鼠标,点击`保存`关闭


4. 拖动`创建新行`到画布区,设置`设置值`为`网页元素内容`的动态内容,点击确定


5. 点击`保存`,切换到`执行预览`;在`关键字`中输入"洗衣机",并点击`开始`按钮运行应用


第三节:使用循环和判断

`循环`主要用于处理一些重复性的动作,`判断`主要用于根据不同的条件执行不同的动作
下面我们将模拟一个实际的业务场景:将所有洗衣机价格大于2000元的商品保存到数据视图



1. 删除`创建新行`
2. 双击`获取网页元素`,修改名称为"获取结果数量",选择提取类型为`个数`


3. 点击`捕获网页元素`,在弹出的对话框中点击`开始录制`,将鼠标移到价格上点击,点击`获取相似元素`,依次保存


4. 拖动`循环执行`到画布区,设置`循环次数`为`获取结果数量`


5. 拖动`获取网页元素内容`到画布区,并重命名为"获取价格",修改`网页元素位置`为`已循环次数`


6. 重复第3步,录制价格


7. 拖动`正则表达式`到画布区,重命名为`提取价格`,设置`正则表达式`为"¥(\d+)",设置`要匹配的内容`为`获取价格`,点击确定


8. 拖动`条件判断`到画布区,判断条件设置为"提取价格 大于 2000",点击确定
9. 拖动`获取网页元素内容`到画布区,重命名为`获取商品名称`,点击`捕获网页元素`,在弹出的录制窗口中点击`开始录制`,将鼠标移动到商品名称位置并点击鼠标,点击`获取相似元素`,点击`保存`关闭
10. 拖动`创建新行`到画布区,设置`设置值`为`获取商品名称`的动态内容,点击确定
11. 点击`保存`,切换到`执行预览`;在`关键字`中输入"洗衣机",并点击`开始`按钮运行应用




展开
收起
码栈 2017-01-18 16:57:38 16174 0
5 条回答
写回答
取消 提交回答
  • 图片链接挂了。

    2019-10-15 17:22:16
    赞同 2 展开评论 打赏
  • Re快速获取天猫商品价格
    最后一步获取了商品标题,如何同时获取商品的价格呢
    2017-12-26 15:40:33
    赞同 展开评论 打赏
  • Re快速获取天猫商品价格
    第三节 第7条的 正则表达式是错的,¥(\d+)  改为\d+  就对了,结果总是不对,害我找了一下午原因,
    2017-07-14 16:27:06
    赞同 展开评论 打赏
  • 小小的一个站长
    Re快速获取天猫商品价格
    码栈确实不错,就是流畅度和教程还没有出来
    2017-07-07 16:24:55
    赞同 展开评论 打赏
  • Re快速获取天猫商品价格
    怎么后面的没有截图呢
    2017-07-04 15:08:39
    赞同 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载