如何在此特定网站上以编程方式模拟用户点击？

Question

我正在尝试在类似日期选择器的元素上使用 javascript 触发点击。 这适用于 puppeter 无头浏览器集成，但首先我需要我的代码在 devtools 控制台中工作。

但是它不起作用...不像正常的手动点击。 我已经尝试了好几个小时了

特定网站在这里（使用反应）

https://www.homeaway.co.uk/p4787689

您必须单击“签入停留”才能出现模式日期选择器，然后我的意图是在日期数字之一上执行 javascript 单击。 “1”、“2”、“3”……在下方可见

This is how date picker looks like

单个日期条目（我们要点击）的html结构如下： 每个日期（01.08.2019、02.08.2019 等）都是“td”行。它的班级甚至在名称上都有“可点击”。所以它应该是我们要点击的元素。

<td class="day no-gridlines selectable clickable" data-column="4" data-row="1" tabindex="-1" aria-label="August 9, 2019" aria-hidden="false">

    <div class="calendar-template calendar-template--show-availability calendar-template--show-selectability">
        <div class="day-template day-template--available-stay day-template--available-checkin-checkout">
            <div class="day-template__border">
            </div>
            <div class="day-template__content">
                <div class="day-template__day">9</div>
            </div>
        </div>
    </div>
</td>

我已尝试获取这些 TD 元素中的每一个：

document.querySelectorAll('.day.no-gridlines.selectable.clickable')

然后点击其中一个

document.querySelectorAll('.day.no-gridlines.selectable.clickable')[4].click()

但它不起作用？

我试图检查事件点击处理程序，但是该网站正在使用一些框架..所以对于像我这样的初学者来说非常困难。

也许有经验的人可以建议，为什么我不能在那个网站上执行点击？

Answer 1

如果你显示一个页面会更好，那里有这些可点击的元素（因为在你的链接上我什至找不到一个可点击的类）......无论如何，在控制台中试试这个：

javascript:function AutoClickOnThese()
{
    var targets = document.querySelectorAll(".clickable");
    Array.prototype.forEach.call(targets, function(target,index){
        //If the clicks start some ajax request, these sure will be restricted
        //if too much running in an unrealistic time
        //... if there are no ajax, just delete the timeout stuff
        setTimeout(function()
        {
            target.onclick();
            //target.click(); //if not working the onclick
        }, index*600);
    });
};
AutoClickOnThese();