时间戳

首页 > 解决方案 > 如果以编程方式处理，选择标签不会更新/填充

javascript - 如果以编程方式处理，选择标签不会更新/填充

问题描述

我在一个网站上（您无权访问），该网站要求您选择带有精选标签的汽车。

如果我手动工作，一切正常。但是，以自动方式更新内容不会更新其他任何内容。这里是一系列选择标签，手动更新1，自动填充下一个标签。

标签示例

尝试 1（更新选择标签的值）

如果我在开发人员工具中这样做，而不是手动单击并选择其中一个标签

var elem = document.evaluate("/html/body/div[2]/div[2]/div/mat-dialog-container/mq-add-vehicle-dialog/div[2]/select", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

elem.value = "07"; // (because 07 = value of model group 595)

然后模型组确实更新了，但模型没有填充选项，所以我无法继续。我只剩下你在下面看到的了。

html

所以这个方法确实适用于当前的选择标签，但由于某种原因不会用选项更新下一个标签

尝试 2（点击）

我想，如果用 .value 更新值不起作用，我可以单击选择标签以显示选项，然后手动单击 595 选项，我可能会填充模型。所以我尝试了...

var elem = document.evaluate("/html/body/div[2]/div[2]/div/mat-dialog-container/mq-add-vehicle-dialog/div[2]/select", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

elem.click();

这根本没有任何作用。我希望它会带来如下图所示的选项下拉列表，这样我就可以单击其中一个选项。

选择点击后的选项

我也试过直接点击选项标签而不打开选择列表。这也没有任何作用（可能是因为选择标签已关闭）。

我想知道他们将更新下一个标签的功能隐藏在哪里。有人知道我哪里出错了吗？或者我接下来应该尝试什么？我确实尝试遍历页面上的每个元素，单击每个元素以查找单击时打开选择标签的东西。似乎没有任何东西以编程方式与之交互。它只响应真实用户。

我如何以编程方式操作这些标签？

更新

继上一个答案之后，表明问题是 angularjs 我已经下载了batarang 并试图检查我的元素的范围。然而这失败了。这个网站是 angularjs 吗？什么是赠品？脑袋里有东西？

下面是一张图片，显示我正在检查测试样本网站的范围（以显示batarang 正在运行）和正在运行的网站。

角度js图片

标签： javascripthtmlweb-scrapingselenium-chromedriverwebautomation

解决方案

正如我从 html 源代码中看到的那样，该网站使用 angular。我猜网站会根据其角度范围变量的值进行自我更新。取决于这是 angularjs 还是 angular（更高版本），访问范围的方式会改变，但对于 angularjs 的情况，您应该以编程方式访问范围。我敢打赌，这个页面是 angularjs（不是 angular）。当 angularjs 范围发生变化时，它应该相应地更新其内部状态。

推荐阅读