Question

<tbody>
  <tr>
    <td data-name="Name"><a href="https://test.ca">test</a></td>
    <td data-name="Active Ingredients"><a href="http://test1.ca">test13</a></td>
    <td data-name="Strength"><a href="http://test3.ca">20mg</a></td>
    <td data-name="Picture">
      <a href="">
        <img src="" />
      </a>
    </td>
  </tr>
</tbody>

我有以下html。

我该如何通过操纵up页面评估来获取具有值名称及其href值的所有tdata-name

非常感谢您的帮助。

Answer 1

一个变体：

'use strict';

const puppeteer = require('puppeteer');

(async function main() {
  try {
    const browser = await puppeteer.launch();
    const [page] = await browser.pages();

    const html = `
      <!doctype html>
      <html>
        <head><meta charset='UTF-8'><title>Test</title></head>
        <body>
          <table><tbody>
            <tr>
              <td data-name="Name"><a href="https://test.ca">test</a></td>
              <td data-name="Active Ingredients"><a href="http://test1.ca">test13</a></td>
              <td data-name="Strength"><a href="http://test3.ca">20mg</a></td>
              <td data-name="Picture"><a href=""><img src=""></a>
          </tbody></table>
        </body>
      </html>`;

    await page.goto(`data:text/html,${html}`);

    const data = await page.evaluate(() => Array.from(
      document.querySelectorAll('td'),
      td => ({ [td.dataset.name]: td.querySelector('a[href]').href }),
    ));

    console.log(data);

    await browser.close();
  } catch (err) {
    console.error(err);
  }
})();

输出：

[
  { Name: 'https://test.ca/' },
  { 'Active Ingredients': 'http://test1.ca/' },
  { Strength: 'http://test3.ca/' },
  { Picture: '' }
]

从tbody木偶页面评估获取td数据名href

1 个答案: