Как я могу исключить класс внутри строки регулярного выражения?

Question

В настоящее время я пытаюсь создать регулярное выражение, которое заменяет все теги HTML внутри строки, за исключением специального элемента. Проблема в том, что я также не нашел способа исключить закрывающий тег специального элемента. Это мой код:

let str = 'You have to pay <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span> <div class="keep-this">$500</div> also';

console.log(str.replace(/(?!<div class="keep-this">)(<\/?[^>]+(>|$))/g, ""));

Как это исправить?

Answer 1

Если вы хотите удалить все элементы html, которые не имеют класса keep-this, вы также можете использовать DOMParser и, например, использовать : не .

let str = 'You have to pay <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span> <div class="keep-this">$500</div> also';
let parser = new DOMParser();
let doc = parser.parseFromString(str, "text/html");
doc.querySelectorAll("body *:not(.keep-this)").forEach(e => e.replaceWith(e.innerHTML));
console.log(doc.body.innerHTML);

Answer 2

Попробуйте эту опцию, которая соответствует всем тегам HTML, исключая те теги, которые имеют атрибут class="keep-this".

let str = 'You have to pay <input class="some-class"/> blah <div class="keep-this">$200</div> per <span class="date">month</span> for your <span class="vehicle">car</span> <div class="keep-this">$500</div> also';

console.log(str.replace(/<\s*([^\s>]+)(?:(?!\bclass="keep-this")[^>])*>(.*?)(?:<\/\1>)|<\s*([^\s>]+)(?:(?!\bclass="keep-this")[^>])*\/>/g, "$2"));

Вот объяснение шаблона регулярного выражения:

<                                 match < of an opening tag
\s*                               optional whitespace
([^\s>]+)                         match and capture the HTML tag name in $1 (\1)
(?:(?!\bclass="keep-this")[^>])*  match remainder of tag,
                                  so long as class="keep-this" is not seen
>                                 match > of an opening tag
(.*?)                             match and capture the tag's content in $2,
                                  until hitting the nearest
(?:<\/\1>)                        closing tag, which matches the opening one
|                                 OR
<\s*([^\s>]+)                     match a standalone tag e.g. <input/>
(?:(?!\bclass="keep-this")[^>])*  without a closing tag
\/>                               which matches                            

Затем мы просто заменяем все такие совпадения пустой строкой, чтобы эффективно удалить их.