puppeteerで要素数をカウントしたい

実現したいこと

puppeteerで下記のような<tr>について、それぞれの<td></td>の数を取得したい。

<tr class="a">
  <td></td>
</tr>

<tr class="b">
  <td></td>
  <td></td>
</tr>

<tr class="c">
  <td></td>
  <td></td>
  <td></td>
</tr>

期待する結果

a: 1
b: 2
c: 3
といったような集計を行いたいです。

行動規範の内容に同意します

回答1件

ベストアンサー

この様な感じではいかがでしょうか。

html
1# テスト用HTML
2
3<html>
4
5<head>
6  <meta charset="UTF-8">
7  <title>Dev Server</title>
8</head>
9
10<body>
11  <table bordercolor="#00bfff">
12    <tr class="a">
13      <td>a1</td>
14    </tr>
15
16    <tr class="b">
17      <td>b1</td>
18      <td>b2</td>
19    </tr>
20
21    <tr class="c">
22      <td>c1</td>
23      <td>c2</td>
24      <td>c3</td>
25    </tr>
26  </table>
27</body>
28
29</html>

js
1# Main プログラム
2
3const puppeteer = require("puppeteer")
4
5const main = async () => {
6  const browser = await puppeteer.launch()
7  const page = await browser.newPage()
8
9  await page.goto("http://localhost:8080/")
10　// テスト用サーバーを起動しているので、ターゲットとなるURLにしてください。
11
12  const scrapingData = await page.evaluate(() => {
13    const dataList = []
14    const nodeList = document.querySelectorAll("tr")
15
16    nodeList.forEach(_node => {
17      const class_name = _node.className
18      const td_count = _node.innerHTML.match(/<td>/g).length
19
20      dataList.push(`${class_name}:${td_count}`)
21    })
22
23    return dataList
24  })
25
26  console.log(scrapingData)
27
28  browser.close()
29}
30
31main()
32

js
1# 実行結果
2
3[ 'a:1', 'b:2', 'c:3' ]

投稿2018/12/06 02:10

編集2018/12/06 02:12

shou6

総合スコア305

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

puppeteerで要素数をカウントしたい

実現したいこと

期待する結果

関連した質問