+-
我正在制作一个Puppeteer脚本,它会截取页面上所有元素的屏幕截图。它有效,但我不明白为什么以下不起作用:
const elements = await page.querySelectorAll('*');
(node:31953)TypeError:page.querySelectorAll不是函数
只有这个有效:
const elements = await page.$$('*');
我试图避免使用jQuery语法。如何使querySelectorAll('*')工作?这是完整的脚本:
const puppeteer = require('puppeteer');
( async() => {
const browser = await puppeteer.launch( {
headless: true } );
const page = await browser.newPage();
await page.goto( 'https://www.google.com' );
// Get a list of all elements. Why can't I use page.querySelectorAll('*')?
const elements = await page.$$('*');
for (let i = 0; i < elements.length; i++) {
try {
// get screenshot of a particular element
await elements[i].screenshot({path: `${i}.png`})
} catch(e) {
// if element is 'not visible', spit out error and continue
console.log(`couldnt take screenshot of element with index: ${i}. Because: `, e)
}
}
await browser.close();
} )();
1
投票
投票
如果你检查page.$$
中的documentation,你会发现实际上,木偶操纵者在querySelectorAll()
上运行document
。 但如果你愿意的话
避免使用jQuery语法。如何使querySelectorAll('*')工作
解决方案是访问页面文档并在那里执行querySelectorAll()
const allElems = await page.evaluate(() => {
// Note 1: here you can use querySelectorAll()
// Note 2: eval can't return non-serializable data, so, you need to JSON.stringify() it to receive what you need.
return JSON.stringify(document.querySelectorAll())
})
关于evaluate的更多信息
总结一下,这是O.K.使用$$
选择器,因为它不是jQuery样式,而是DOM Selector。