javascript - 如何从 puppeteer 抓取表中输出正确的 json?

标签 javascript json puppeteer

我是 pupeteer 的新手,不知道它的全部潜力。我有以下代码从抓取返回结果。但格式是一个长制表符分隔的字符串。我正在尝试获取正确的 json。

(async () => {
const browser = await puppeteer.launch( {headless: true} );
    const page = await browser.newPage();
    await page.goto(url, {waitUntil: 'networkidle0'});

    let data = await page.evaluate(() => {
        const table = Array.from(document.querySelectorAll('table[id="gvM"] > tbody > tr ')); 
        return table.map(td => td.innerText);
    })

    console.log(data);
})();

这是html表:
<table cellspacing="0" cellpadding="4" rules="all" border="1" id="gvM" >
        <tr >
            <th scope="col">#</th><th scope="col">Resource</th><th scope="col">EM #</th><th scope="col">CVO</th><th scope="col">Start</th><th scope="col">End</th><th scope="col">Status</th><th scope="col">Assignment</th><th scope="col">&nbsp;</th>
        </tr>
        <tr >
            <td>31</td><td>Smith</td><td>618</td><td align="center"><span class="aspNetDisabled"><input id="gvM_ctl00_0" type="checkbox" name="gvM$ctl02$ctl00" disabled="disabled" /></span></td><td>&nbsp;</td><td>&nbsp;</td><td>AVAILABLE EXEC</td><td style="width:800px;">6F</td><td align="center"></td>
        </tr>
        <tr style="background-color:LightGreen;">
            <td>1</td><td>John</td><td>604</td><td align="center"><span class="aspNetDisabled"></span></td><td>1400</td><td>2200</td><td>AVAILABLE</td><td style="width:800px;">&nbsp;</td><td align="center"></td>
        </tr>
</table>

这就是我得到的:
[ '#\tResource\tEM #\tCVO\tStart\tEnd\tStatus\tAssignment\t ', '31\tSmith\t618\t\t \t \tAVAILABLE EXEC\t6F\t', '1\tJohn\t604\t\t1400\t2200\tAVAILABLE\t \t']
这就是我想要得到的:
[{'#','Resource','EM', '#','CVO','Start','tEnd','Status', 'Assignment'}, {'31','Smith', '618',' ',' ',' ',' ','AVAILABLE EXEC','6F'}, {'1','John', '604',' ',' ','1400 ','2200','AVAILABLE', ' '}]
我应用了下面的答案,但我无法重现结果。也许我做错了什么。你能解释一下我怎么搞砸了吗?
const context = document.querySelectorAll('table[id="gvM"] > tbody > tr ');

const query = (selector, context) => Array.from(context.querySelectorAll(selector));
console.log( 
    query('tr', context).map(row => 
        query('td, th', row).map(cell => 
        cell.textContent))  
);

这个错误是什么意思?(node:6204) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with. .catch(). (rejection id: 1) (node:6204) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

最佳答案

如果您需要表中的数组数组,您可以尝试这种方法,将所有行映射到行数组,将所有单元格映射到行元素内的单元格数组(此变体使用 Array.from() 和映射函数作为第二个论点):

const data = await page.evaluate(
  () => Array.from(
    document.querySelectorAll('table[id="gvM"] > tbody > tr'),
    row => Array.from(row.querySelectorAll('th, td'), cell => cell.innerText)
  )
);

关于javascript - 如何从 puppeteer 抓取表中输出正确的 json?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55368153/

相关文章:

java - 从 URL 的数组中获取数组

selenium - 登录网站时如何使用 puppeteer/selenium 重用保存的凭据/密码?

javascript - Iron Router 和 Meteor 中的服务器端路由

javascript - 如何使用正则表达式根据字符串过滤数组项?

javascript - 如何在 AngularJs 中将 json 数组转换为 js 数组?

ios - 解析 json 并保存核心数据 swift 2.0 最佳实践

javascript - Puppeteer 不会点击元素

node.js - 如何使用 puppeteer wsendpoint 打开链接

javascript - PHP 脚本不等待 Ajax 和 jQuery document.ready

javascript - React 和 Redux 架构问题