Digamos que tengo este elemento:
<a href="#" class="employee" data-id="123" data-name="john doe" >Me gustaría obtener los atributos de datos a través de un conjunto de datos. Puedo usar el código a continuación para obtener un atributo de datos individual, pero si quiero obtener ambos atributos de datos *, tendría que raspar dos veces.
const person = await page.$eval(".employee", (el) => el.getAttribute("data-id") );He intentado esto, pero devuelve un objeto vacío.
const person = await page.$eval(".employee", (el) => el.dataset );Intente usar el.attributes que devolverá todos los atributos del elemento y luego podrá obtener los datos del valor devuelto sin tener que raspar dos veces.
O, en general, intente guardar el elemento y luego obtener los datos de él, o use expresiones regulares para seleccionar los atributos que comienzan con data-
Tal vez esto:
import puppeteer from 'puppeteer'; const browser = await puppeteer.launch(); const html = ` <!doctype html> <html> <head><meta charset='UTF-8'><title>Test</title></head> <body> <a href='#' class='employee' data-id='123' data-name='john doe'>John Doe</a> </body> </html>`; try { const [page] = await browser.pages(); await page.goto(`data:text/html,${encodeURIComponent(html)}`); const data = await page.evaluate(() => { const dataset = document.querySelector('a').dataset; return Object.fromEntries(Object.entries(dataset)); }); console.log(data); // { id: '123', name: 'john doe' } } catch (err) { console.error(err); } finally { await browser.close(); }Logré lograrlo con esto, pero aún estoy muy abierto a saber cómo recuperar el objeto del conjunto de datos.
const dataset = await page.$eval(".employee", (el) => { return { id: el.getAttribute("data-id"), name: el.getAttribute("data-name") } });