Search code examples
javascriptregex

Less or greater than characters except html tags?


I need to replace less or greater than(< >) characters, but keep any html tags(simple tags will do like <b>text</b> without arguments). So the input below:

<b>> 0.5 < 0.4</b> - <>

Should be:

<b>&gt; 0.5 &lt; 0.4</b> - &lt;&gt;

All I managed to find and edit now is this expr:

<\/?[a-z][a-z0-9]*[^>\s]*>|([<>])

It groups the < and > characters but it also matches tags witch I don't need to replace

UPD: Thanks to @Sree Kumar, here's the final functions:

String.prototype.replaceAt = function (index, char) {
    let arr = this.split('');
    arr[index] = char;
    return arr.join('');
};

String.prototype.escape = function () {
    let p = /(?:<[a-zA-Z]+>)|(?:<\/[a-zA-Z]+>)|(?<lt><)|(?<gt>>)/g,
        result = this,
        match = p.exec(result);

    while (match !== null) {
        if (match.groups.lt !== undefined) {
            result = result.replaceAt(match.index, '&lt;');
        }
        else if (match.groups.gt !== undefined) {
            result = result.replaceAt(match.index, '&gt;');
        }
        match = p.exec(result);
    }
    return result;
};

Solution

  • Here is a way to do it using named groups. That is, name your desired group and look for it. It may be null or undefined at times because it didn't match. Hence, you will have to add the null check.

    Notice (?<B>...) surrounding the "desired" group. Also, notice the null check in the 5th line.

    let p = /(?:<[a-zA-Z]+>)|(?:<\/[a-zA-Z]+>)|(?<B>[<>])/g
    let input = '<b>> 0.5 < 0.4</b> - <>';
    let match = p.exec( input );
    while( match !== null) {
        if( match.groups.B !== undefined ) console.log( match.groups.B );
        match = p.exec( input )
    }