Regex - Match multiline blocks of HTML code

Question

I have a problem with my regular expression. I need to match blocks of HTML.

Example-Block here:

<tr class="tr-list " data-id="XX">
    <td class="ip-img"><div class="gun-icon"></div><img src="https://example.com/images/stories/HCP/HCP_5.jpg"/></td>
    <td class="ip-name ip-sort">Hotel Complex Project</td>
    <td class="ip-price ip-sort">297.00</td>
    <td class="ip-earnings ip-sort">43</td>
    <td class="ip-shares ip-sort">86</td>
    <td class="ip-status {'sorter':'currency'}"><img
            src="/img/assets/arrow1.png" title="0.989990234375"/></td>
    <td class="ip-blank-right"></td>
</tr>

Everyone of these blocks of HTML should match separately which I then want to extract the other data from (eg. ip-name, ip-price, ip-earnings..).

But my current regex matches everything until the "(?=)"-part is not true anymore: http://regexhero.net/tester/?id=2b491d15-ee83-4dc7-8fe9-62e624945dcf

What do I need to change to have every block as a match?

Greetings! :)

PS.: Hope it is understandable what I mean...

Answer 1

This should get all the tr rows:

<tr class="tr-list[\s\S]+?</tr>

This should get all the tr rows with matching groups for the columns:

<tr class="tr-list[^<]*?<td class="ip-img">(.*?)</td>\s*<td class="ip-name.*?">(.*?)</td>\s*<td class="ip-price.*?">(.*?)</td>\s*<td class="ip-earnings.*?">(.*?)</td>\s*<td class="ip-shares.*?">(.*?)</td>\s*<td class="ip-status.*?">([\s\S]*?)</td>[\s\S]+?</tr>

Answer 2

嵌套的html将需要来自正则表达式匹配的嵌套数组，这可以使用jquery完成，也可以使用正则表达式手动生成树

Answer 3

This Regular Expression will capture a whole html block that is not self-enclosed:

var hmtlText="<div bar='baz'>foo</foo>";
var pattern = /<([\w]+)( (( +)?[\w]+=['"](\w+)?['"])?)+( )?(\/)?>((([\t\n\r\s]+)?)+(((.)+)?)+((\10)?)+)+?<\/(\1)>/igm;
console.log((pattern.test(htmlText) ? 'valid' : 'invalid') + ' html block');