JavaScript regex.exec() should intended to use an assembled regEx

Question

if I use ( https://jsfiddle.net/fgsvzn4a/ ) :

var text = "ui1pu";
var regExParameter = '\d+';
var regEx = '/(.*)' + regExParameter + '(.*)/gi';
var matches = regEx.exec(text);
if(matches && matches[1]) {
    var str1 = matches[1];
    var str2 = matches[2];
    var newStr = str1 + str2
    console.log(newStr);
}

i get this error:

Paused on exception
TypeError: regEx.exec is not a function

this prototype is working (inspired by https://stackoverflow.com/a/15845184/2891692 ):

var text = "my1bla";
var matches = /(my)\d+(.*)/gi.exec(text);
if(matches && matches[1]) {
var str1 = matches[1];
var str2 = matches[2];
var newStr = str1 + str2
alert(newStr);
}

but i want to use input parameters to build the regex (first example).

i get ReferenceError: Regex is not defined if i try this:

var text = "ui1pu";
var regExParameter = '\d+';
var regExString = '/(.*)' + regExParameter + '(.*)/gi';
var regEx = new Regex(regExString);
var matches = regEx.exec(text);
if(matches && matches[1]) {
    var str1 = matches[1];
    var str2 = matches[2];
    var newStr = str1 + str2
    console.log(newStr);
}

any idea?

[`RegExp`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) — Heretic Monkey, Sep 27 '22 at 21:32
See also [How do you use a variable in a regular expression?](https://stackoverflow.com/q/494035/215552) — Heretic Monkey, Sep 27 '22 at 21:33

score 1 · Accepted Answer · answered Sep 27 '22 at 21:34

Use the RegExp constructor. Note that the slashes should be omitted from the string and the flags should be passed as the second argument.

var text = "ui1pu";
var regExParameter = '\\d+';
var regExString = '(.*)' + regExParameter + '(.*)';
var regEx = new RegExp(regExString, 'gi');
var matches = regEx.exec(text);
if(matches && matches[1]) {
    var str1 = matches[1];
    var str2 = matches[2];
    var newStr = str1 + str2
    console.log(newStr);
}

SL5net · Answer 2 · 2022-09-28T06:21:31.637

Based on the previous correct answers, I was able to come up with this more comprehensive solution. Its a little modification of this correct answer by Unmitigated and all answers :

// window.replaceDOM = function (regExParameter, replaceParameter) {
function replaceDOM(regExParameter, replaceParameter) {
// let reg = '/' + search + '/';
// regExParameter = '\\d+';
console.log('regExParameter=' + regExParameter);
const regExString = '(\\w+)' + regExParameter + '(\\w+)'; // ugly but needet. that escape, that double backslash
console.log('regExString=' + regExString);
const regEx = new RegExp(regExString, 'gi');

let elems = document.body.getElementsByTagName("*");
for (i in elems) {
    let ele = elems[i];
    if(ele.classList){
        const val = ele.classList.value;
        if(!val)
            continue;

        const matches = regEx.exec(val);
        if(matches && matches[1]) {
            console.log('val=' + val);
            const str1 = matches[1];
            const str2 = matches[2];
            const valNew = str1 + replaceParameter + str2
            // alert(valNew);
            console.log('valNew=' + valNew);
            ele.classList.value = ele.classList.value.replace(val, valNew);
        }
    }
};
}

.my1bla {
  background-color: black;
}

.mybla {
  background-color: blue;
}

<button onclick="replaceDOM('y\\d+','y')">
change the style class from DIV using regEx</button>
<div class="my1bla">
I am a DIV element
</div>

JavaScript regex.exec() should intended to use an assembled regEx

2 Answers2

Linked