как выбрать первый тег p из html, который является строкой?

Question

Я извлекаю контент из безголовой CMS и получаю содержимое в виде строки вроде:

<div>
  <p>1st p tag</p>
  <p>2nd p tag</p>
</div>

как выбрать 1-й тег p, чтобы у меня было что-то вроде этого:

const firstPtagContent = "1st p tag"

Answer 1

Вы можете проанализировать строку с помощью DOMParser и использовать querySelector для получения первого p

const str = `<div>
  <p>1st p tag</p>
  <p>2nd p tag</p>
</div>`

let doc = new DOMParser().parseFromString(str, 'text/html')

console.log(
  doc.querySelector('p').textContent
)

Answer 2

Примерно так будет работать:

var firstParagraph = document.getElementById('container').getElementsByTagName('p')[0]
console.log(firstParagraph.textContent)

<div id="container">
  <p>1st p element</p>
  <p>2st p element</p>
</div>

Answer 3

Вы можете попробовать что-то вроде этого:

  var x = document.getElementById("myText").innerText;

 console.log(x);

<div>
  <p id="myText">1st p tag</p>
  <p>2nd p tag</p>
</div>

Answer 4

Вы можете использовать ниже фрагмент.

var firstParagraph = document.getElementById('container').getElementsByTagName('p')[0]
console.log(firstParagraph.textContent)

p { outline: dotted  red } /* Just to show the widths */

<div id="container">
   <p>1st p tag</p>
   <p>2nd p tag</p>
</div>