Puppeteer:找不到 Javascript 加载的元素
Puppeteer: Cannot find element loaded by Javascript
我一直在使用 Puppeteer 来抓取一些网站,当我需要的元素在 DOM 中时效果很好;但是,当通过 Javascript 加载元素时,我无法让它工作。例如。请在下面查看我的代码。更具体地说,page.waitForSelector 总是触发超时错误。我试过 page.screenshot,结果图像确实显示了一个完全加载的页面,其中包含这个 .evTextFont 元素。
如何修改此代码以成功检索 .evTextFont 元素?
我已经尝试了 Puppeteer 版本 1.11 和 1.17,但是我遇到了同样的问题
非常感谢
改编自here
const puppeteer = require('puppeteer');
const URL = 'https://www.paintbar.com.au/events-1/moments-in-moonlight';
puppeteer.launch({ headless: true, args: ['--no-sandbox', '--disable-setuid-sandbox'] }).then(async browser => {
const page = await browser.newPage();
await page.setViewport({width: 1200, height: 600})
await page.goto(URL, {waitUntil: 'networkidle0'});
await page.waitForSelector('.evTextFont');
await page.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'});
// await page.screenshot({ path: './image.jpg', type: 'jpeg' });
const result = await page.evaluate(() => {
try {
var data = [];
$('.evTextFont').each(function() {
const title = $(this).text();
data.push({
'title' : title,
});
});
return data;
} catch(err) {
console.log(err.toString());
}
});
await browser.close();
for(var i = 0; i < result.length; i++) {
console.log('Data: ' + result[i].title);
}
process.exit();
}).catch(function(error) {
console.error(error);
process.exit();
});
这是因为您要查找的事件显示在另一个站点的 iframe
元素内,因此您需要先找到该 iframe,然后对其进行操作。
await page.goto(URL, {waitUntil: 'networkidle0'});
// Looking for the iframe with the event
const frame = (await page.frames()).find(f => f.url().includes("events.wix.com"));
// Then do work as before, but on that frame
await frame.waitForSelector('.evTextFont');
await frame.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'});
const result = await frame.evaluate(() => {...})
我一直在使用 Puppeteer 来抓取一些网站,当我需要的元素在 DOM 中时效果很好;但是,当通过 Javascript 加载元素时,我无法让它工作。例如。请在下面查看我的代码。更具体地说,page.waitForSelector 总是触发超时错误。我试过 page.screenshot,结果图像确实显示了一个完全加载的页面,其中包含这个 .evTextFont 元素。
如何修改此代码以成功检索 .evTextFont 元素?
我已经尝试了 Puppeteer 版本 1.11 和 1.17,但是我遇到了同样的问题
非常感谢
改编自here
const puppeteer = require('puppeteer');
const URL = 'https://www.paintbar.com.au/events-1/moments-in-moonlight';
puppeteer.launch({ headless: true, args: ['--no-sandbox', '--disable-setuid-sandbox'] }).then(async browser => {
const page = await browser.newPage();
await page.setViewport({width: 1200, height: 600})
await page.goto(URL, {waitUntil: 'networkidle0'});
await page.waitForSelector('.evTextFont');
await page.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'});
// await page.screenshot({ path: './image.jpg', type: 'jpeg' });
const result = await page.evaluate(() => {
try {
var data = [];
$('.evTextFont').each(function() {
const title = $(this).text();
data.push({
'title' : title,
});
});
return data;
} catch(err) {
console.log(err.toString());
}
});
await browser.close();
for(var i = 0; i < result.length; i++) {
console.log('Data: ' + result[i].title);
}
process.exit();
}).catch(function(error) {
console.error(error);
process.exit();
});
这是因为您要查找的事件显示在另一个站点的 iframe
元素内,因此您需要先找到该 iframe,然后对其进行操作。
await page.goto(URL, {waitUntil: 'networkidle0'});
// Looking for the iframe with the event
const frame = (await page.frames()).find(f => f.url().includes("events.wix.com"));
// Then do work as before, but on that frame
await frame.waitForSelector('.evTextFont');
await frame.addScriptTag({url: 'https://code.jquery.com/jquery-3.2.1.min.js'});
const result = await frame.evaluate(() => {...})