Selectores de atributos
Selector de atributo: selecciona elementos que tengan un cierto atributo (CSS 2)
- jquery("a[rel]")
También se puede seleccionar aquellos que tengan un cierto valor para un atributo (CSS 2)
- jquery("a[rel='nofollow']")
O que tengan un valor distinto del indicado (jQuery)
- jQuery("a[rel!='nofollow']")
Aquellos cuyo valor empieza por una cierta cadena (CSS 3)
- jquery("a[href^='http://mundogeek.net/']")
Los que terminan con una cierta cadena (CSS 3)
- jquery("a[href$='.com']")
Y los que contienen una cierta cadena (CSS 3)
- jquery("a[href*='geek']")
Por último, podemos hacer combinaciones de todo lo anterior (CSS 2)
- jquery("a[rel='nofollow'][href]")
Selectores de widgets
Pseudo clase botón: selecciona todos los botones (jQuery)
- jquery(":button")
Pseudo clase checkbox: selecciona todos los checkboxes (jQuery)
- jquery(":checkbox")
Pseudo clase archivo: selecciona todos los widgets de tipo archivo (jQuery)
- jquery(":file")
Pseudo clase cabeceras: selecciona todas las cabeceras (jQuery)
- jquery(":header")
Pseudo clase imagen: selecciona todas las imágenes (jQuery)
- jquery(":image")
Pseudo clase input: selecciona todos los widgets de tipo input (jQuery)
- jquery(":input")
Pseudo clase contraseña: selecciona todos los elementos password (jQuery)
- jquery(":password")
Pseudo clase radiobutton: selecciona todos los elementos radiobutton (jQuery)
- jquery(":radio")
Pseudo clase reset: selecciona todos los elementos reset (jQuery)
- jquery(":reset")
Pseudo clase seleccionado: selecciona las opciones seleccionadas en un select (jQuery)
- jquery(":select")
Pseudo clase submit: selecciona todos los elementos submit (jQuery)
- jquery(":submit")
Pseudo clase texto: selecciona todos las cajas de texto (jQuery)
- jquery(":text")
Pseudo clase marcado: selecciona todos los radiobuttons y checkboxes marcados (CSS 3)
- jquery(":checked")
Pseudo clase activo: selecciona todos los elementos que estén activos (CSS 3)
- jquery("input:enabled")
Pseudo clase inactivo: selecciona todos los elementos que no estén activos (CSS 3)
- jquery("input:disabled")
Pseudo clase ocultos: selecciona todos los elementos ocultos (jQuery)
- jquery(":hidden")
Pseudo clase visible: selecciona todos los elementos visibles (jQuery)
- jquery(":visible")
Selectores de jerarquía
Selector de descendientes: selecciona elementos que desciendan de otro elemento (CSS 1)
- jquery("div.entrada h2")
Selector de hijos: selecciona elementos que sean hijos directos de otro elemento (CSS 2)
- jquery("div.entrada > h2")
Pseudo clase hijo: selecciona el enésimo hijo de un elemento (CSS 3)
- jquery("tr:nth-child(1)")
Pseudo clase primer hijo: selecciona el primero hijo de un elemento (CSS 2)
- jquery("tr:first-child")
Pseudo clase último hijo: selecciona el último hijo de un elemento (CSS 3)
- jquery("tr:last-child")
Pseudo clase hijo único: selecciona los elementos que sean hijos únicos de otros elementos (CSS 3)
- jquery("div:only-child")
Pseudo clase índice: selecciona el elemento con el índice indicado de un grupo de elementos (jQuery)
- jquery("td:eq(0)")
Pseudo clase primero: selecciona el primer elemento de un grupo de elementos. Equivale a
eq(0) (jQuery)- jquery("td:first)")
Pseudo clase último: selecciona el último elemento de un grupo de elementos (jQuery)
- jquery("td:last)")
Pseudo clase mayor que: selecciona todos los elementos con un índice mayor que el indicado en un grupo de elementos (jQuery)
- jquery("td:gt(0)")
Pseudo clase menor que: selecciona todos los elementos con un índice menor que el indicado en un grupo de elementos (jQuery)
- jquery("td:lt(3)")
Pseudo clase par: selecciona los elementos pares de un grupo de elementos (jQuery)
- jquery("td:even")
Pseudo clase impar: selecciona los elementos impares de un grupo de elementos (jQuery)
- jquery("td:odd")
Selector de hermanos: selecciona todos los hermanos que se encuentren precedidos de otro elemento (CSS 3)
- jquery("div.entrada ~ p")
Selector de próximo adyacente: similar al anterior, pero sólo selecciona el adyacente directo (CSS 2)
- jquery("div.entrada + p")
Pseudo clase padre: selecciona los padres de otros elementos (jQuery)
- jquery("h2:parent")
Pseudo clase vacío: selecciona los elementos que no tengan ningún hijo, incluyendo texto plano (CSS 3)
- jquery(":empty")
Otros selectores
Pseudo clase animado: selecciona todos los elementos que están en proceso de animación en este momento (jQuery)
- jquery(":animated")
Pseudo clase contiene: selecciona todos los elementos que contengan el texto indicado, directamente o en uno de los hijos (jQuery)
- jquery("div:contains('Mundo geek')")
Pseudo clase tiene: selecciona todos los elementos que contengan al menos un elemento que responda al selector indicado (jQuery)
- jquery("div:has(h2)")
Pseudo clase negación: selecciona todos los elementos que no cumplan con el selector dado (CSS 3)
- jquery("div:not(.entrada)")
