How to split a html string with start and end character

Question

If i have similar requirement where I want to create an array with all the <tr>. I want to split with start <tr> and </tr>. How can i give both start and end in split function.

<!DOCTYPE html>
<html>
<body>

<h2>Basic HTML Table</h2>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
 
  </tr>
  <tr>
    <td>Jill</td>
   
  </tr>
  <tr>
    <td>Eve</td>

  </tr>
  <tr>
    <td>John</td>
   
  </tr>
</table>

</body>
</html>

mplungjan · Accepted Answer · 2021-05-12T05:23:55.527

2

Don't use split

const arr = [...document.querySelectorAll('tr')].map(tr  => tr.outerHTML)
console.log(arr)

// if the source is a string:

const tblString = `<table style="width:100%"><tr><th>Firstname</th></tr><tr><td>Jill</td></tr><tr><td>Eve</td></tr><tr><td>John</td></tr></table>`

const domFragment = document.createElement('div')
domFragment.innerHTML = tblString;
const arr1 = [...domFragment.querySelectorAll('tr')].map(tr  => tr.outerHTML)
console.log(arr1)

<!DOCTYPE html>
<html>

<body>

  <h2>Basic HTML Table</h2>

  <table style="width:100%">
    <tr>
      <th>Firstname</th>
    </tr>
    <tr>
      <td>Jill</td>
    </tr>
    <tr>
      <td>Eve</td>
    </tr>
    <tr>
      <td>John</td>
    </tr>
  </table>

</body>

</html>

edited May 12 '21 at 05:23

answered May 11 '21 at 20:21

mplungjan

169,008
28
173
236

But I want array content along with the tr tags – user15895653 May 11 '21 at 20:23
arr = ["Jill", "Jack".....] something like this – user15895653 May 11 '21 at 20:24
let t ="John
Firstname
Jill
Eve
. I tried on this one gave me the blank array. – user15895653 May 12 '21 at 05:24
1

See update I just made, how to parse the string – mplungjan May 12 '21 at 05:25
Yes thanks it works. Why didnt you use split here, thats the first thing came to my mind. – user15895653 May 12 '21 at 05:27
1

Don't parse HTML with string manipulation - here is [great post](https://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags/1732454#1732454) - Your split would be a regex – mplungjan May 12 '21 at 05:29

Firstname
Jill
Eve

How to split a html string with start and end character

1 Answers1