Replace string with optional trailing characters

Question

I have the following string with various HTML tags inside:

let str = "3 HTML tags are: <html>, <a href src='www.google.com'>, and <body>.";

I want to replace each HTML tag with an arbitrary value outline within a map:

let map = {
   "<html>":"<HTML>",
   "<a*>":"<A HREF SRC='..'",
   "<body>":"<BODY>"
};

However, for certain tags like <a href="...", I want to simply leave the href value intact and simply replace the <a href="www.google.com"> with <A HREF="www.google.com">

I've tried to add wildcard characters inside the value for the respective key but it's just being hardcoded as an asterisk (*).

Is there a way to accomplish this? Any and all documentation is welcome!

My JSFiddle can be found here

Possible duplicate of [*RegEx match open tags except XHTML self-contained tags*](https://stackoverflow.com/questions/1732348/regex-match-open-tags-except-xhtml-self-contained-tags). You can't relibaly use regular expressions to parse HTML because HTML is not a regular language. — RobG, Jan 30 '18 at 03:32

score 1 · Accepted Answer · answered Jan 30 '18 at 03:38

1

you could try this

let str = "3 HTML tags are: <html>, <a href src='www.google.com'>, and <body>.";
let map = {
   "<html>":"<HTML>",
   "<a href src":"<A HREF SRC",
   "<body>":"<BODY>"
};
str = str.replace(/<html>|<a href src|<body>/gi, function(matched){
  return map[matched];
});

alert(str);

answered Jan 30 '18 at 03:38

zola

5,737
8
33
48

1

This doens't meet the criteria with respect to A elements, i.e. `` with `` since ` – RobG Jan 30 '18 at 04:05

Chirag Ravindra · Answer 2 · 2018-01-30T04:02:46.790

I had to do something similar on a side project. Consider a structure we can call matcher which are basically objects which the following structure

let matcher = {
    id: "htmlTag",
    pattern: "<html>", // This can be string or regexp
    replacer: "<HTML>", // This can be string or a function
}

We can have an array of such objects called matchers which we can iterate over and use the str.replace(regexp|substr, newSubstr|function) to get the output we need.

let matchers = [...];
let str = "3 HTML tags are: <html>, <a href src='www.google.com'>, and <body>.";

matchers.forEach(function(matcher){
    console.log(`Before ${matcher.id}: ${str}`);
    str = str.replace(matcher.pattern, matcher.replacer)
    console.log(`After ${matcher.id}: ${str}`);
})

If you wanted to save the src attribute for a particular tag, for example, you could define a replacer function which gets the matched string which can be processed using string splitting/ regexp matching to build the new string needed (preserving the attributes we need etc).

Replace string with optional trailing characters

2 Answers2