What is the method to extract headings and their adjacent paragraphs using Puppeteer?

Other Questions Puppeteer
1

I have the following structure in my HTML DOM:

<div>
  <h3>Lorem ipsum dolor sit amet</h3>
  <p>First paragraph</p>
  <p>Second paragraph</p>

  <h3>Lorem ipsum dolor sit amet</h3>
  <p>Second paragraph</p>
  <p>Third paragraph</p>
  <p>Fourth paragraph</p>

  <h3>Lorem ipsum dolor sit amet</h3>
  <p>...</p>
  <p>...</p>
  <blockquote>...</blockquote>
</div>

In some cases, there might be one <h3> element followed by three paragraphs, while other times it could be one <h3>, three paragraphs, and a blockquote. However, there is always one heading with its siblings present.

I am looking to construct a JSON object that contains this structure while using Puppeteer, structured like this:

[
  {
    "h3": "heading text here",
    "p": "paragraph text here",
    "p": "another paragraph text here"
  },
  {
    "h3": "heading text here",
    "p": "paragraph text here",
    "blockquote": "blockquote text here"
  },
  {
    "h3": "heading text here",
    "p": "...",
    "p": "..."
  }
]

Thank you for your help!

2

You can iterate over all <h3> tags, and for each tag, traverse its siblings using Puppeteer to determine if they’re <p> or <blockquote>. Add them to JSON objct as needed. make sure to handle edge cases like missing paragraphs to keep the code robust. Hope this helps!