Find text not within HTML tags with Javascript (regex)

Question

I have a string from a DOM element, which contains something similar to the following:

<span class='greenhornet'>Can you catch the green?</span>

I need to know the position of the word green.

In this case, if I setup a pattern /green/, JS exec() of course will return the first occurrence of green (position 13).

Is there a way to tell JS regexp to ignore ! the word green, if it's between < and > or is there an easier way to do this?

Oh, and I can't just strip the HTML either!

thanks.

Use DOM to retrieve all text nodes, concatenate the text node contents, then do your search. This would cover cases like matching "green hornet" even when split by HTML, e.g. <b>green</b> hornet. — Andrew Cheong
– Andrew Cheong, Commented Dec 19, 2012 at 20:59

machineghost · Accepted Answer · 2012-12-20 01:06:33Z

2

As the commentors (and user1883592) have suggested, stripping the HTML or parsing the text out of the HTML is the correct answer here. Using regular expressions with HTML is a loser's game; you've been warned.

But, that being said, if you really want to play that game, I'd start by ensuring there are no opening brackets in between your term and the last closing bracket; in other words:

var greenRegex = />[^<]+(green)/;
var position = "<span class='greenhornet'>Can you catch the green?</span>".search(greenRegex);
// position = 25, not 13

answered Dec 20, 2012 at 1:06

machineghost

36k33 gold badges174 silver badges270 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

alex · Accepted Answer · 2012-12-20 00:17:57Z

0

You can get innerHTML of the span element. No Regex needed.

answered Dec 20, 2012 at 0:17

alex

1,30412 silver badges15 bronze badges

Collectives™ on Stack Overflow

Find text not within HTML tags with Javascript (regex)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related