Not able to get matching result from the string using regex in react native but able to get it in crome console

Question

let regex=/(\d*(,|\.)?\d)(.)*(\s+followers)/g;
let result=regex.exec("<div class=\"Content EmbedFrame\" style=\"\">\n" +
          "<a class=\"EmbeddedMedia\" href=\"https://www.instagram.com/p/tsxp1hhQTG/?utm_source=ig_embed&amp;ig_mid=93153B6F-2C77-4A9A-946F-3405DC4F16BA\" data-ios-link=\"media?id=823251211150230726&amp;utm_source=ig_embed&amp;ig_mid=93153B6F-2C77-4A9A-946F-3405DC4F16BA\" data-log-event=\"mediaClick\" target=\"_blank\">\n" +
          "<img class=\"EmbeddedMediaImage\" src=\"https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6\" srcset=\"https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 640w,https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 750w,https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 1080w\" />\n" +
          "\n" +
          "</a>\n" +
          "<span class=\"FollowerCountText\">\n" +
          "339.7m followers\n" +
          "</span>\n" +
          "</div>\n");
console.log(result)

In above code block ,no match is returned in react native , but getting ["339.7m followers", "339.7", ".", "m", " followers"] In the Chrome console. This is simple JS and should work identical in both places, in my opinion.

Have I done something wrong?

Parsing HTML with regex is a hard job HTML and regex are not good friends. Use a parser, it is simpler, faster and much more maintainable. — Toto
– Toto, Commented Mar 25, 2020 at 16:33

The fourth bird · Accepted Answer · 2020-03-25 17:18:26Z

Perhaps Iinstead of using a regex, you could first make use of a DOMParser and a query selector div.Content.EmbedFrame span.FollowerCountText

let html = `<div class="Content EmbedFrame" style="">
<a class="EmbeddedMedia" href="https://www.instagram.com/p/tsxp1hhQTG/?utm_source=ig_embed&amp;ig_mid=93153B6F-2C77-4A9A-946F-3405DC4F16BA" data-ios-link="media?id=823251211150230726&amp;utm_source=ig_embed&amp;ig_mid=93153B6F-2C77-4A9A-946F-3405DC4F16BA" data-log-event="mediaClick" target="_blank">
<img class="EmbeddedMediaImage" src="https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6" srcset="https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 640w,https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 750w,https://scontent-atl3-1.cdninstagram.com/v/t51.2885-15/e15/1538350_1528374764070564_1190643161_n.jpg?_nc_ht=scontent-atl3-1.cdninstagram.com&amp;_nc_cat=100&amp;_nc_ohc=QazMmTOnHP0AX85I8r7&amp;oh=e504703e829858339c69701b46f119e4&amp;oe=5EA354E6 1080w" />

</a>
<span class="FollowerCountText">
339.7m followers
</span>
</div>`;


let pattern = /(\d*([,.])?\d)(.)*(\s+followers)/;
let parser = new DOMParser();
let doc = parser.parseFromString(html, "text/html");
let span = doc.querySelector("div.Content.EmbedFrame span.FollowerCountText");
console.log(span.innerHTML.trim());
console.log(span.innerHTML.trim().match(pattern));

Then if you want to use your pattern, you could shorten the alternation to a character class for , and .

(\d*([,.])?\d)(.)*(\s+followers)

Regex demo

Collectives™ on Stack Overflow

Not able to get matching result from the string using regex in react native but able to get it in crome console

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related