Expressões regulares·um seletor de classe CSS

um seletor de classe CSS

Casa com um seletor de classe CSS. Está ancorado nas duas pontas, então a cadeia inteira precisa casar. Não tem grupos de captura.

Padrão
/^\.-?[_a-z][_a-z0-9-]*$/
Alcance
a cadeia inteira
Grupos de captura
0
O que captura no primeiro exemplo
.btn

Experimente

Digite qualquer texto e as partes capturadas serão marcadas. Tudo roda no seu navegador e nada é enviado.

.btn

1 correspondência

Exemplos que casam

  • .btn
  • .-my-class

Exemplos que não casam

  • btn
  • .1st

Outras expressões do grupo

Como ler

  • Com ^ e $ em volta, a cadeia inteira precisa casar; sem eles, a correspondência pode estar em qualquer lugar. Ancore sempre o que usar para validar.
  • Os parênteses ( ) capturam o que envolvem. Se você só precisa agrupar, escreva (?: ) para a numeração não se deslocar.
  • Cada expressão aqui é conferida com seus exemplos. Ainda assim, "parece um e-mail" e "é uma caixa real" são coisas diferentes.
  • Repetições abertas aninhadas como (a+)+ podem explodir com certas entradas. Procure esse formato antes de colar uma expressão alheia.

Perguntas frequentes

Q. Qual é a regex para um seletor de classe CSS?

^\.-?[_a-z][_a-z0-9-]*$.

Q. Quais cadeias casam?

Um texto como .btn casa; um como btn não.

Q. A cadeia inteira precisa casar?

Sim. Está entre ^ e $, então só passa uma correspondência completa.

Q. Como uso o que foi capturado?

Não há grupos de captura, então volta só a correspondência inteira (match[0]). Coloque entre parênteses a parte que precisar.