un selector de clase CSS
Coincide con un selector de clase CSS. Está anclado en ambos extremos, así que debe coincidir la cadena entera. No tiene grupos de captura.
Patrón
/^\.-?[_a-z][_a-z0-9-]*$/- Alcance
- la cadena entera
- Grupos de captura
- 0
- Lo que captura en el primer ejemplo
- .btn
Pruébalo
Escribe cualquier texto y se marcará lo que captura la expresión. Todo ocurre en tu navegador y no se envía a ninguna parte.
.btn
1 coincidencia
Ejemplos que coinciden
- .btn
- .-my-class
Ejemplos que no coinciden
- btn
- .1st
Otras expresiones del grupo
^.+\.(?:jpe?g|png|gif|webp|avif|svg)$una extensión de archivo de imagen^/(?:[^/\0]+/)*[^/\0]*$una ruta estilo Unix^[A-Za-z]:\\(?:[^\\/:*?"<>|]+\\)*[^\\/:*?"<>|]*$una ruta de Windows^</?[a-z][a-z0-9]*(?:\s[^<>]*)?/?>$una etiqueta HTML^M{0,3}(?:CM|CD|D?C{0,3})(?:XC|XL|L?X{0,3})(?:IX|IV|V?I{0,3})$un número romano^-?(?:90(?:\.0+)?|[1-8]?\d(?:\.\d+)?)$un valor de latitud^-?(?:180(?:\.0+)?|1[0-7]\d(?:\.\d+)?|\d{1,2}(?:\.\d+)?)$un valor de longitud^(?:0|[1-9]\d*)$un número sin cero a la izquierdaCómo leerlo
- Con ^ y $ alrededor, debe coincidir la cadena entera; sin ellos, la coincidencia puede estar en cualquier parte. Ancla siempre lo que uses para validar.
- Los paréntesis ( ) capturan lo que envuelven. Si solo necesitas agrupar, escribe (?: ) para que no se desplace la numeración.
- Cada expresión de aquí se comprueba con sus ejemplos. Aun así, "parece un correo" y "es un buzón real" son cosas distintas.
- Las repeticiones abiertas anidadas como (a+)+ pueden dispararse con ciertas entradas. Busca esa forma antes de pegar una expresión ajena.
Preguntas frecuentes
Q. ¿Cuál es la regex para un selector de clase CSS?
^\.-?[_a-z][_a-z0-9-]*$.
Q. ¿Qué cadenas coinciden?
Un texto como .btn coincide; uno como btn no.
Q. ¿Debe coincidir la cadena entera?
Sí. Va entre ^ y $, así que solo pasa una coincidencia completa.
Q. ¿Cómo uso lo capturado?
No hay grupos de captura, así que solo vuelve la coincidencia completa (match[0]). Envuelve entre paréntesis la parte que necesites.