const regex = /(?<=\,|\+|\~|\>|\(|\)|\[|\]|\{|\}|^)(?<s>\s*)(?<tag>a|div|p|span|img|button)(?!\s*\[[^\]]*__canvas[^\]]*\])(?=[\:\,\+\~\>\(\)\[\]\{\}\s]+)(?=[^\}\;]*[\{])/gm;
// Alternative syntax using RegExp constructor
// const regex = new RegExp('(?<=\\,|\\+|\\~|\\>|\\(|\\)|\\[|\\]|\\{|\\}|^)(?<s>\\s*)(?<tag>a|div|p|span|img|button)(?!\\s*\\[[^\\]]*__canvas[^\\]]*\\])(?=[\\:\\,\\+\\~\\>\\(\\)\\[\\]\\{\\}\\s]+)(?=[^\\}\\;]*[\\{])', 'gm')
const str = `@media only screen and (max-width: 600px) {
div>a[__canvas]:hover,a,div {
background-color: lightblue;
}
i+img>audio,table:not(a+p),
button~.a
,
span{
background-color: lightblue;
}
}
a {
background: url(http://a.b.com);
font-family: cursive, a, serif;
}
img
{
color: a;
font-family: a, serif;
}`;
const subst = `${s}${tag}[__canvas]`;
// The substituted value will be contained in the result variable
const result = str.replace(regex, subst);
console.log('Substitution result: ', result);
Please keep in mind that these code samples are automatically generated and are not guaranteed to work. If you find any syntax errors, feel free to submit a bug report. For a full regex reference for JavaScript, please visit: https://developer.mozilla.org/en/docs/Web/JavaScript/Guide/Regular_Expressions