Replace the matched group with spaces

Here is the contents of the <style> tag of my HTML document:

<style>          a:link { color: blue; }    a:link:hover { color: red;  }  </style>  

As you see rules are aligned by the opening brace.

Now I need to to remove the :link part from the second rule and keep the alignment in tact.

Here is what I have:

function getStyleAndChangeIt() {    let style = document.querySelector('style').innerText;    style = style.replace(/(a)(?::link)(:hover|:focus|:active)/g, '$1$2');    return style;  }  

It doesn't solve the task, of course. It simply removes the :link part without keeping the alignment in tact.

So how to change it so that it will work exactly as I want it? Cheers.

It is actually necessary to replace the :link part with spaces and place these spaces before a, but I don't know how.

edit:

In other words, the desired output is:

   a:link { color: blue; }    a:hover { color: red;  }  

https://stackoverflow.com/questions/66620172/replace-the-matched-group-with-spaces March 14, 2021 at 09:18AM