2. 开发问题
  3. UiBot如何使用CSS Selector

UiBot如何使用CSS Selector

王易 2020-3-14 3736

UiBot默认的数据抓取可以抓取整个表格，但是有时候我们并不想抓取整个表格，比方说，我们想将下图所有的头像复制到Excel里：_UiBot如何使用CSS Selector

这个时候我们无法使用数据抓取功能，因为我们并不是想抓取数据，而是要操作网页里的元素。

将上图头像复制到Excel里的步骤是：

  1. 打开Excel
  2. 打开浏览器并打开网页
  3. 复制第1个头像到Excel
  4. 复制第2个头像到Excel
  5. ……
  6. 复制最后一个头像的Excel

打开Excel和打开网页这些功能都比较简单，可以使用UiBot内置的功能。复制头像需要写一个循环，需要一个变量来标记是第几个头像，另外我们还需要确定这些头像的元素。这里我们就需要用到CSS Selector，他可以帮我们定位头像元素，并且可以和计数变量结合使用。

使用CSS Selector之前,需要学习CSS，当然，CSS并不是很复杂的语言。大家可以到W3CSchool去学习。这里我仅讲在UiBot里如何使用CSS Selector。

https://www.w3school.com.cn/css/index.asp

UiBot里使用CSS Selector的方法

第一步：和平时一样，使用“点击目标”方法

_UiBot如何使用CSS Selector

第二步：进入“源代码”界面，修改代码

_UiBot如何使用CSS Selector

Mouse.Action({“wnd”:[{“cls”:”Chrome_WidgetWin_1″,”title”:”*”,”app”:”chrome”},{“cls”:”Chrome_RenderWidgetHostHWND”,”title”:”Chrome Legacy Window”}],”html”:{“tagName”:”IMG”,”attrMap”:{“css-selector”:”table.tab-weiboRanking>tbody>tr:nth-of-type(” & i & “) img”},”index”:0}},”right”,”click”,10000,{“bContinueOnError”:false,”iDelayAfter”:500,”iDelayBefore”:200,”bSetForeground”:true,”sCursorPosition”:”Center”,”iCursorOffsetX”:0,”iCursorOffsetY”:0,”sKeyModifiers”:[],”sSimulate”:”simulate”})

上面代码的i为元素循环计数器。

这样就大功告成了。有了CSS Selector，UiBot真的可以无限制地操作浏览器，功能得到了极大的扩展。

原文链接：http://www.baladong.com/it/491.html

最新回复 (10)
  • life 2020-3-14
    2楼
    好文章源码变量都用上了
  • 瞌睡蟲子 2020-3-15
    3楼


    _UiBot如何使用CSS Selector

    {"tabName":"*","attrMap":{"css-selector":css,"aaname":aname},"index":index}

    1、tabName改成*，可以直接匹配css的结果，不用改指定元素名

    2、css不能通过text抽取，兼容aanme，加上text过滤，默认值设置为"*"

    3、index指定元素位置，虽然nth-of-type(),nth-child()都可以指定位置，不过这个相对方便。

  • luo 2020-3-16
    4楼
    你们咋这么溜呢
  • kin1234 2022-2-9
    5楼
    在网页表格上循环填表的问题，css-selector如何修改？
    UiElement.SetValue({"wnd":[{"cls":"Chrome_WidgetWin_1","title":"*","app":"chrome"},{"cls":"Chrome_RenderWidgetHostHWND","title":"Chrome Legacy Window"}],"html":[{"tag":"TEXTAREA","css-selector":"body>div>div>div>div>div>div>div>div>div>div>table>tbody>tr>td>div>textarea","tableRow":"2","tableCol":"6"}]},"222",{"bContinueOnError":false,"iDelayAfter":300,"iDelayBefore":200})

    网页有个表格，希望读取excel表格中的数据并循环填入网页对应的表格，上面是选择了网页第2行，第6列的单元格的示例，对应"tableRow":"2","tableCol":"6"，希望把里面的数值用i，j替代，但是修改为"tableRow":"&i&","tableCol":"&j&"时，程序总是报错，请教各位大神如何解决？
  • 草碳酸 2022-2-9
    6楼


    hWeb = WebBrowser.BindBrowser("chrome",10000,{"bContinueOnError":False,"iDelayAfter":300,"iDelayBefore":200})

    Dim sRet = ""

    Dim uu="1"

    TracePrint sRet

    For i = 1 To 20 Step 1 

    uu=uu+1

    iRet = CInt(uu)

    TracePrint iRet

    sRet = CStr(iRet)

    TracePrint sRet

    #icon("@res:vep3vu4f-gj67-g0p7-41p5-9gpoqlsu7v2c.png")

    sRet1 = UiElement.GetValue({"wnd":[{"cls":"Chrome_WidgetWin_1","title":"*","app":"chrome"},{"cls":"Chrome_RenderWidgetHostHWND","title":"Chrome Legacy Window"}],"html":[{"tag":"A","parentid":"table_wrapper-table","aaname":"*","tableRow":sRet,"tableCol":"3"}]},{"bContinueOnError":False,"iDelayAfter":300,"iDelayBefore":200})

    TracePrint sRet1

    uu = CInt(sRet)

    Next

    tableRow后面要接字符，把数值转成字符就能用

  • 程达 2022-5-9
    7楼
    有点明白
  • 小李子_1781 5月前
    8楼

    在UB最新版本（6.X）上，上述的语法，我压根无法跑通。

    相反，选择元素的参数（objUiElement），语法必须是这样（我自己本地在最新UB上尝试）：

    {"wnd":[{"cls":"Chrome_WidgetWin_1","title":"*","app":"chrome"},{"cls":"Chrome_RenderWidgetHostHWND","title":"Chrome Legacy Window"}],"html":[{"tag":"*","idx":1,"css-selector":"#body > div > div > div"}]}。

    其中，红色部分属性是重命名了，黄色部分和虫子大师说的语法不同（不需要用attrMap封装了），而绿色部分相比虫子说的，功能弱了很多：比如，例子中说的头像，CSS语法是：

    #body > div > div > div.col-lg-9.main > div > div.card-body > ul > li:nth-child(1) > a > img

    但是，只要绿色字体部分再往后一点，带上class属性，比如加上“.col-lg-9.main”，UB就一定找不到该元素！

    @瞌睡虫子 大师：能否确认下，新版本上为什么变成这样了？


  • 小李子_1781 5月前
    9楼
    好吧，我自问自答。刚才找到答案了：6.X版本上，就是这个样子！
    由于新版本UB无法使用浏览器的CSS Selector（一条路径，不存在多路径），所以必须借助idx来指定路径。这时你才会发现：原来 UB 自带的浏览器，已经具备了找到idx的功能！
    更多信息参见：https://www.php-note.com/2451.html
    BTW：UB的文档更新，真的该提上日程了！
  • 小李子_1781 5月前
    10楼


    可是这种指定idx的方法，面对复杂的网页，实在没有规律可寻，无法自动化设定啊。

    比如，为了循环获得uibot帖子列表中的下一个发帖人名称，idx可能是+5，但也可能是+4，取决于是否有人回帖。但是Chrome的CSS Selector却稳定而有规律，与是否有回帖无关。

    请问大伙：

    1. 哪个版本的uibot可以使用chrome浏览器 CSS Selector，例如可以指定class、id或者nth-of-type的；

    2. 或者有其它替代方法（虽然数据爬取是使用类似于浏览器的CSS Selector，但是效率不高，不太常用）？


  • 叶枫_367972 5月前
    11楼
    NB
返回
发新帖