如何修复 Node/Cheerio 中的“$(...).click 不是函数”

Question

我正在用 Node.js 编写一个应用程序，该应用程序将导航到网站，单击网站上的按钮，然后从网站中提取某些数据。除了点击按钮之外，一切都很顺利。我似乎无法模拟按钮单击。我对此非常陌生，所以我很感激你们提出的任何建议！遗憾的是，我在互联网上搜索了这个问题的解决方案，但一直找不到。

我在使用“request”和“cheerio”的 .js 文件中使用了

.click()

和

.bind('click, ...)

。

我还尝试在使用“chrome-launcher”、“chrome-remote-interface”和“puppeteer”的不同 .js 文件中使用

page.click()

和

page.evaluate()

。

这是我的“request”和“cheerio”文件的代码：

const request = require('request');
const cheerio = require('cheerio');

let p1 = {}, p2 = {}, p3 = {}, p4 = {}, p5 = {};

p1.name = 'TheJackal666';

p2.name = 'Naether Raviel';

p3.name = 'qman37';

p4.name = 'ranger51';

p5.name = 'fernanda12x';

const team = {1: p1, 2: p2, 3: p3, 4: p4, 5: p5};

for(var x in team){
        let url = 'https://na.op.gg/summoner/userName=' + 
team[x].name;

        request(url, (error, response, html) => {
            if (!error && response.statusCode == 200) {
                const $ = cheerio.load(html);
                 
                $('.SummonerRefreshButton.Button.SemiRound.Blue').click(); 
//FIXME: MAKE A FUNCTION THAT SUCCESSFULLY "CLICKS" UPDATE BUTTON

                team[x].overallWR = $('.winratio');
                team[x].overallWR = 
team[x].overallWR.text().match(/\d/g);
                team[x].overallWR = 
team[x].overallWR.join("");

            console.log(team[x].overallWR);
            }
        });
}

我希望成功单击任何页面上的更新按钮（页面上有一个部分显示上次更新时间），而不会出现错误。事实上，我要么得到一个错误：

"$(...).click is not a function"

或者（如果我将该行合并到外部函数中）我不会得到任何错误，但没有结果。

Answer 1

请参阅文档：

Cheerio 不是网络浏览器

Cheerio 解析标记并提供用于遍历/操作结果数据结构的 API。它不会像网络浏览器那样解释结果。具体来说，它不产生视觉渲染、应用 CSS、加载外部资源或执行 JavaScript。如果您的用例需要任何此功能，您应该考虑 PhantomJS 或 JSDom 等项目。

Answer 2

Cheerio 是一个 HTML 解析器。

Cheerio 可以用来选择和操作 dom 元素，但它不是一个完整的浏览器。

Cheerio 只能访问原始源 dom，这意味着如果网页的 dom 由 javascript 操作，Cheerio 将不会注意到这种变化。

Cheerio 不能用于与 dom 元素（ala jQuery）交互，因为它不会在窗口（js 窗口）中类似地执行

目前，如果您需要操作或选择 js 渲染的 html，您最好的选择是 puppeteer。不过，这可能会改变，

HTH

Answer 3

可以编写 JS 片段，然后使用

cheerio

添加它

示例：

const jsSnippet = `
<script>
  console.log('hello world!');
</script>
`;

const $cheerio = cheerio.load(myHtml);
$cheerio(jsSnippet).appendTo('body');