Javascript regex replace spaces and html

Question

Im trying to replace words in a string which may have html tags or spaces. So if I want to find/replace Javascript:

var text = 'Java Javascript and <li>Javascript</li> javascript';
var find = "Javascript"; 

var regex = new RegExp(`(?:>|\s)(${find})(?:<|\s)`, "gi");
var result = text.replace(regex, 'JavascriptUpdated');

console.log(result, "result");

However its not finding the char space version and I dont want to replace "<" just allow it to find.

Im using "\s" to no find inside words, so if search was "Java" I dont want to find that in inside "Javascript"

https://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags — Jorge.V, Sep 17 '19 at 12:08
First of all, see the top comment. Second, `\s` => `\\s`. Third, use capturing group at the start (`(^|[\\s>])`) and a lookahead at the end (`(?![^\\s<])`). Fourth, escape the `${find}`. — Wiktor Stribiżew, Sep 17 '19 at 12:15
@WiktorStribiżew Looks like `${find}` (and the `\s`) are in a template string, so no need to escape them. — Jordan Kasper, Sep 17 '19 at 16:07
@WiktorStribiżew Sorry, but those are both fine. See my posted answer, works just fine. It's a template string, should not be escaped. — Jordan Kasper, Sep 17 '19 at 16:17

Pushprajsinh Chudasama · Answer 1 · 2019-09-17T16:56:05.940

0

Here you can manually replace your string using search() method .

var text = 'Java Javascript and <li>Javascript</li> javascript';
var find = "Javascript"; 
var toUpdate = "javascriptUpdated";
var regex = /(<li> *|<li>)/g;

var index = text.search(regex); //search the index where regex got match . 
text = text.substr(0, index + 4) + toUpdate + text.substr(index + 13); //replacing the string manually .

console.log(text, "result"); //your result .

You can see my running code . If you have any doubt , feel free to ask .

edited Sep 17 '19 at 16:56

answered Sep 17 '19 at 12:55

Pushprajsinh Chudasama

7,772
4
20
43

Running your code outputs `Error: { "message": "Uncaught SyntaxError: Unexpected identifier", "filename": "https://stacksnippets.net/js", "lineno": 20, "colno": 35 }` – Wiktor Stribiżew Sep 17 '19 at 16:20
Wait .. Lemme edit it .. Sorry for that one .. We just hve to add` // your result` .. It will fix – Pushprajsinh Chudasama Sep 17 '19 at 16:39
Edited the code . You can check it out . @WiktorStribiżew – Pushprajsinh Chudasama Sep 17 '19 at 16:44

score 0 · Answer 2 · answered Sep 17 '19 at 16:17

First, see the first comment above... parsing HTML is bad news. That said, if you know there are constraints then you should be ok (he said maniacally).

There's a couple ways to do this, but the most minimal changes to your code probably just need to be the regex and then using capture groups (and their indices) in the replacement.

var text = 'Java Javascript and <li>Javascript</li> javascript';
var find = "Javascript"; 

// notice capture groups for the angle brackets and spaces
var regex = new RegExp(`(>\s*)(${find})(\s*<)`, "gi");
// notice the use of $1 and $3 in here to reuse the > and < characters (and spaces)
var result = text.replace(regex, '$1JavascriptUpdated$3');

console.log(result, "result");

Javascript regex replace spaces and html

2 Answers2