首页 > 解决方案 > Puppeteer 按他的班级名称选择一个段落

问题描述

我想选择 ap 这是唯一一个有类名的。但是为什么javascript代码不起作用?

注意:我不能做elements[i].className =="test",因为每次我重新打开网站时类名都会改变。

当我在控制台中运行它时,我得到:

undefined
undefined
undefined

const puppeteer = require('puppeteer');

async function test() {
const browser = await puppeteer.launch({ headless: false, timeout: 0};
const page2 = await browser.newPage();
await page2.goto("localhost");
await page2.waitFor(2530);
const elements = await page2.evaluate(() => [...document.querySelectorAll('p')]);
for (var i = 0; i < elements.length; i++) {
  if(elements[i].className){
    console.log(elements[i].innerText);
  }
}

}
test();

<p>text1</p>
<p class="test">text2</p>
<p>text3</p>

标签: javascriptnode.jsweb-scrapingpuppeteer

解决方案


const puppeteer = require('puppeteer');

async function test() {
const browser = await puppeteer.launch({ headless: false, timeout: 0};
const page2 = await browser.newPage();
await page2.goto("localhost");
await page2.waitFor(2530);
const elements = await page2.evaluate(() => [...document.querySelectorAll('p')]);
for (var i = 0; i < elements.length; i++) {
  if(elements[i].className){
    console.log(elements[i].innerText[]);
  }
}

}
test();

更改此行

console.log(elements[i].innerText[]);

console.log(elements[i].innerText);

并使用它从评估中返回一个段落数组

 const textsArray = await page2.evaluate(
        () => [...document.querySelectorAll('p')].map(elem => elem.innerText)
    );

这将返回段落标签中所有文本的数组,否则您可以操作 map 以返回数组内的对象及其类名,如果您想要两者

像这样

const textsArray = await page2.evaluate(() => 
     [...document.querySelectorAll('p')].map(elem => 
      { return {class: elem.className,  text:elem.innerText}
     )
    );

推荐阅读