Regex - Select the inverse

Question

I am having trouble selecting the opposite of what i previously selected

String:

<!-- Button --><div><button></div><!-- Input --><input type="text">

I managed to select the comments by using:

/<!--[\s\w]*-->/

Now I want to select everything but the comments. Desired output

<div><button></div> and <input type="text">

My question is what would the Regex search string be in order to select the previously mentioned output ?

Will matching and replacing your comments with empty string work? — Pushpesh Kumar Rajwanshi, May 15 '19 at 10:06
What does everything but the comments mean? Presuming this is a HTML page you want the entire HTML excluding the comments? This isn't going to be practical using regex, not to mention you really shouldn't be trying to [parse HTML using regex](https://stackoverflow.com/a/1732454/542251) — Liam, May 15 '19 at 10:35
Read up on positive/negative lookaheads/lookbehinds, and then decide against doing what you want to do. You shouldn't be parsing HTML with Regex, unless _maybe_ if it's just locally in an IDE and not using JavaScript (or any other languages). — James Whiteley, May 15 '19 at 10:38
I updated the question maybe it is a little clearer now.. @mickmackusa — Steinar, May 15 '19 at 10:54

mickmackusa · Answer 1 · 2019-05-15T11:36:40.657

1

I believe the js equivalent of php's preg_split with PREG_SPLIT_NO_EMPTY is like this:

yourstring.split(/<!--[\s\w]*-->/g).filter(n => n)

jsfiddle: https://jsfiddle.net/75rLaeoj/

Using a dom parser may be a little more complicated because you want to group one or more tags together.

edited May 15 '19 at 11:36

answered May 15 '19 at 10:24

mickmackusa

43,625
12
83
136

@Steinar does this work properly for your project data? If not please provide a realistic sample that breaks it so that I can make an adjustment. – mickmackusa May 15 '19 at 11:38

score 1 · Answer 2 · answered May 15 '19 at 10:40

1

An easy way to get the inverse is to replace the regex selection:

let html = '<!-- Button --><div><button></div><!-- Input --><input type="text">'

let noComments = html.replace(/<!--[\s\w]*-->/g,"") 

console.log(noComments) //<div><button></div><input type="text">

answered May 15 '19 at 10:40

chatnoir

2,185
1
15
17

This upvoted answer is not what the OP wants. I wish voters would be more discerning. – mickmackusa May 15 '19 at 10:56
This answer returns a string, the OP wants an array of qualifying strings. – mickmackusa May 15 '19 at 11:48
@mickmackusa Looks like the output from OP's own answer is pretty much the same as mine. Maybe it's time to remove your downvote from my answer? – chatnoir May 15 '19 at 13:16
It appears you don't know the difference between a string and an array, I've been very clear about why your answer is wrong. – mickmackusa May 15 '19 at 13:23
@mickmackusa So the OP's also wrong I suppose. I read his tone in "Yes, kind of but," and interpreted it as such. You interpreted it as an array and nothing else, which is kinda unnecessarily literal imho. But hey I didn't downvote your answer. – chatnoir May 15 '19 at 13:44
Then I commend you for your restraint. Questions here need to be clear and all answers should provide the exact desired output. The OP stated that he/she wants `this` and `that`. These two items are not expressed as a single string, they are expressed as two separate strings or else the desired output would have been written `thisthat`. It is important to precisely answer questions here because future researchers come here to learn. – mickmackusa May 15 '19 at 13:47
I guess I felt that returning html code stripped of comments would make a lot more sense to the OP than returning random html fragments that had arbitrarily been separated by comments. But hey that's me. – chatnoir May 15 '19 at 14:16
I don't know how you can possibly make that judgement. I don't have a crystal ball at my house. – mickmackusa May 15 '19 at 20:32

score -1 · Accepted Answer · edited May 15 '19 at 15:29

-1

I figured it out, I had previously had problems with Regex only selecting the first instance but I found out I was missing the global tag /.../g

The answer to getting the inverse is /<[^!]*?>.*?>/g

var s = '<!-- Button --><div><button></div><!-- Input --><input type="text">'
console.log(s.match(/<[^!]*?>/g))

Reference: https://javascript.info/regexp-greedy-and-lazy

edited May 15 '19 at 15:29

James Whiteley

3,363
1
19
46

answered May 15 '19 at 11:37

Steinar

149
1
16

1

This does not provide the output that you stated in your question. Proof: https://jsfiddle.net/75rLaeoj/ This answer individually matches each html tag. Either the question is wrong or this answer is wrong. – mickmackusa May 15 '19 at 11:44
@Steinar you need to clarify what you wanted out of this question/answer. It doesn't make sense right now as your apparent solution doesn't solve your original problem. – James Whiteley May 15 '19 at 15:31

Regex - Select the inverse

3 Answers3