REGEX для соответствия начального и конечного тегов span без их внутреннего текста

Question

Я использую следующий RegEx для замены строки:

<\/?(span)\b(?:\s+class="highlight")?>

Но у этого регулярного выражения есть недостаток ... Возьмите этот пример кода, например:

<p>
   Some text here
   <span class="highlight">This is highlighted</span>
   <span>This is not highlighted</span>
</p>

Мое регулярное выражение будет соответствовать обоим тегам span, хотя я хочу только один с установленным class = "highlight".Как я могу добиться этого, используя RegEx?

PS: пожалуйста, не говорите мне, что я не должен использовать RegEx для этого, потому что я понижу ваш ответ, поскольку он не по теме.Это вопрос для ребят из RegEx.

РЕДАКТИРОВАТЬ: основываясь на принятом ответе ниже, я использую следующее регулярное выражение для замены. ПРИМЕЧАНИЕ: код в javascript (mootools)

var regex = new RegExp("(<span[^>]+class\\s*=\\s*(\"|')highlight\\2[^>]*>)(.*?)(</span>)",'g');
var replaced = element.get('html').replace(regex, "$3");
element.set('html', replaced);

Приведенное выше регулярное выражение заменит некоторый текст здесь на "некоторый текст здесь" (без двойных кавычек)

Answer 1

Это должно обеспечить наибольшую гибкость.

(<span[^>]+class\s*=\s*("|')highlight\2[^>]*>)[^<]*(</span>)

ОБНОВЛЕНИЕ:

Захваченные группы, которые вам нужны для открывающих и закрывающих тегов: \ 1 и \ 3.

Answer 2

Просто чтобы показать вам, что альтернативное решение не только возможно, но и лучше , чем использование регулярного выражения:

$$('span.highlight').each(function (node, idx, Elem) {
    var txt = document.createTextNode(Elem.get('text'));
    node.parentNode.replaceChild(txt, node)
});

См. Эту скрипку: http://jsfiddle.net/Tomalak/umgZp/

(И это не в моей голове, я до сих пор не видел MooTools. Возможно, есть более изящные способы, чем этот.)

Answer 3

Вы явно заявляете, что эта часть class=highlight является необязательной, помещая ? перед группой, которая ее захватывает.

Это должно сделать это для вас:

var regex = /(?:<span\s+[^>]*?\s*class\s*=\s*('|")(?:\S+\s+)?highlight(?:\s+\S+)?\1[^>]*>|<\/span>/;

Это также будет включать теги SPAN с такими атрибутами класса, как a b c highlight e f g.

Кроме того, если вы хотите захватить тег SPAN с его окончанием , соответствующим , вы можете использовать его и получить доступгруппы 1 и 3 соответственно для начального и конечного тегов:

var regex = /(<span\s+[^>]*?\s*class\s*=\s*('|")(?:\S+\s+)?highlight(?:\s+\S+)?\1[^>]*>).*?(<\/span>)/;