regex to get contents between tag

Question

I have used following regex to get only contents between <b> and </b> tags.

var bonly = defaultVal.match("<b>(.*?)</b>");

but it did not worked. I'm not getting proper result. Sample string I'm using regex on:

<b>Item1</b>: This is item 1 description.

<b>Item1</b>: This is item 1 description.<b>Item2</b>: This is item 2 description.

<b>Item1</b>: <b>Item2</b>: This is item 2 description. <b>Item3</b>: This is item 3 description.<b>Item4</b>:  

<b>Item1</b>: This is item 1 description.<b>Item2</b>: This is item 2 description.    <b>Item3</b>: This is item 3 description.<b>Item4</b>:

Here item name is compulsory but it may have description or may not have description.

Regex is not a good tool for HTML, see http://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags/1732454#1732454 — cobbal, Aug 30 '11 at 05:06

score 7 · Accepted Answer · answered Aug 30 '11 at 05:06

7

Why don't you skip regex and try...

var div = document.createElement('div');

div.innerHTML = str;

var b = div.getElementsByTagName('b');

for (var i = 0, length = b.length; i < length; i++) {
    console.log(b[i].textContent || b[i].innerText);
}

jsFiddle.

answered Aug 30 '11 at 05:06

alex

479,566
201
878
984

What's with the first two lines? – Phil Aug 30 '11 at 05:09
but I don't have a surrounding `
` element.
– Harry Joy Aug 30 '11 at 05:10
1

@Phil Assuming the text is a string in `str`. If it's inside an element, skip the first two lines :) – alex Aug 30 '11 at 05:11
@mark Regex is performed on strings. Is your example above a string or actual HTML in your document? This code doesn't rely on surrounding `div` element, it just uses one as a generic container. – alex Aug 30 '11 at 05:11
1

@mark Then this code will work, as per the fiddle demonstrates. – alex Aug 30 '11 at 05:15
@alex: Yes it works. Actually I didn't noticed that you are creating new `
` element.
– Harry Joy Aug 30 '11 at 05:22

jfriend00 · Answer 2 · 2011-08-30T05:22:32.067

There are a zillion questions/answers here on SO about using regex to match HTML tags. You can probably learn a lot with some appropriate searching.

You may want to start by turning your regular expression into a regular expression:

var defaultVal = "<b>Item1</b>: This is item 1 description.";
var bonly = defaultVal.match(/<b>(.*?)<\/b>/);
if (bonly && (bonly.length > 1)) {
    alert(bonly[1]);    // alerts "Item1"
}

You may also need to note that regular expressions are not well suited for HTML matching because there can be arbitrary strings as attributes on HTML tags that can contain characters that can really mess up the regex match. Further, line breaks can be an issue in some regex engines. Further capitalization can mess you up. Further, an extra space here or there can mess you up. Some of this can be accounted for with a more complicated regex, but it still may not be the best tool.

Depending upon the context of what you're trying to do, it may be easier to create actual HTML objects with this HTML (letting the browser do all the complex parsing) and then use DOM access methods to fetch the info you want.

It works here: http://jsfiddle.net/jfriend00/Man2J/.

Works here. Perhaps you got a version before I was completely done. Please try again. — jfriend00, Aug 30 '11 at 05:13
Sorry it was my mistake. The problem is due to surrounding `"` in match regex. removed that and all worked fine. Thnx — Harry Joy, Aug 30 '11 at 05:20

score 1 · Answer 3 · answered Aug 30 '11 at 05:13

1

try this regexp

var bonly = defaultVal.match(/<([A-z0-9]*)\b[^>]*>(.*?)<\/\1>/)

answered Aug 30 '11 at 05:13

zloydadka

160
3

regex to get contents between tag

3 Answers3