Complementando as outras respostas, existe um corner case na solução proposta por elas. Se o HTML tiver um span
comentado dentro do span
que você quer pegar:
<span class='pages'>1 de <!-- <span> comentado </span> --> 8</span><span class='current'>1</span>
A regex <span class='pages'>(.*?)</span>
vai pegar o trecho:
<span class='pages'>1 de <!-- <span> comentado </span>
Deixando de fora o fechamento do comentário (-->
), o 8
e o fechamento da tag (</span>
) - veja aqui.
Isso acontece porque o quantificador lazy ("preguiçoso") *?
pega a menor quantidade possível de caracteres.
Ou seja, a regex primeiro pega <span class='pages'>
, e depois pega a menor quantidade possível de caracteres que tenha um </span>
depois. Por isso a regex só vai até o </span>
que está dentro dos comentários.
É por casos assim que dizem que regex não é a melhor ferramenta para fazer parsing de HTML. Para o caso acima, por exemplo, qualquer parser de HTML (que a grande maioria das linguagens de programação possui) consegue resolver facilmente, pois eles já conseguem analisar a estrutura do HTML e os comentários podem ser facilmente ignorados. Já com regex, você teria que incluir na expressão um trecho para detectar comentários (que não é tão simples assim), ficando mais ou menos assim:
<span class='pages'>((?:[^<>]*|(?=<!--).*?-->)*)</span>
Veja aqui esta regex funcionando.
Agora, em vez de simplesmente .*?
, há duas alternativas (separadas pelo |
, que significa ou):
[^<>]
: é uma classe de caracteres negados. No caso, é "qualquer caractere que não seja <
nem >
". Isso garante que não ultrapassaremos o fechamento da tag, evitando que a regex "invada" outros span
's.
(?=<!--).*?-->
:
- primeiro temos um lookahead (o trecho
(?=<!--)
), que verifica se algo existe à frente. No caso, ele verifica se temos uma abertura de comentário (<!--
)
- depois temos
.*?
(zero ou mais caracteres), com o quantificador lazy para que ele não invada outros comentários (da mesma forma que a solução original usa .*?
para evitar que a regex invada outras tags span
)
- seguido do fechamento de comentário
-->
Toda a alternância possui o quantificador *
(zero ou mais ocorrências), então é basicamente ((?:opção 1|opção 2)*)
. Ou seja, dentro da tag span
eu posso ter vários caracteres que não são <
nem >
, ou vários comentários. Eu uso (?:
para que os parênteses internos não formem um grupo de captura (caso contrário, o conteúdo do mesmo seria capturado em um grupo à parte).
Mas isso ainda não resolve todos os casos. Se o span
tiver outra tag dentro dele:
<span class='pages'>1 de <!-- <span> comentado </span> --> <a href="www.google.com">link</a> 8</span><span class='current'>1</span>
A regex anterior não resolve, já que eu usei [^<>]
para que ele não invadisse outras tags, e por isso a regex falha porque dentro do span
tem a tag <a>
. Então eu teria que mudar para algo do tipo:
<span class='pages'>((?:[^<>]*|(?=<!--).*?-->|<((?!span\b)[^> ]+)[^>]*>.*?</\2>)*)</span>
Veja aqui esta regex funcionando.
Eu adicionei mais uma opção na alternância: <((?!span\b)[^> ]+)[^>]*>.*?</\2>
. Basicamente, ela pega qualquer tag que não seja span
, mas de maneira bem "genérica", já que ela não valida muita coisa. Para o nome da tag, por exemplo, eu usei [^> ]
(qualquer coisa que não seja >
nem espaço), o que quer dizer que se tiver tags como <123.-*()x>
, a regex vai aceitar (veja). Claro que você pode melhorá-la para que ela aceite somente nomes de tags válidos, mas olhe novamente para a regex: ela já está complicada o suficiente, e ainda sim não cobre todos os casos possíveis de HTML's válidos. Será que vale a pena continuar?
É claro que, para poucos casos mais simples, pequenos trechos de HTML, e entradas controladas, nas quais você "sabe" que não terá casos como os citados acima, uma regex mais simples - como a que as outras respostas sugeriram - pode resolver. Mas complique um pouco mais o HTML e já começa a ficar inviável. Para esses casos, um parser específico é o mais indicado.