JQuery selector competente en el uso de [a]
jQuery tiene un motor muy potente selector, para proporcionar una completa selección de la sintaxis, hemos optado por permitir que casi todos los elementos de la cartera. jQuery selector de la sintaxis y CSS3 se basa principalmente en el XPath, y CSS3 XPath entender más el uso de la más importante cuando jQuery mano. CSS y XPath, consulte los siguientes enlaces:
Cabe señalar que, CSS3 no obtener toda la ayuda actual del navegador, por lo que rara vez utiliza. Sin embargo, todavía podemos utilizar jQuery elección CSS3 elementos, como jQuery tienen su propio selector de motor, y la realización de los CSS3 apoyo.
JQuery selector desea saber más información, visite la jQuery oficial de la documentación relativa al Selector. Ahora, el original de los documentos oficiales sobre la base de una simple traducción de unos y notas.
1. Selector de CSS (CSS Selectores)
jQuery pleno apoyo de CSS 1-3, y se puede (Selector) de expresión, la costumbre de añadir-como CSS (y XPath).
1,1 jQuery el apoyo de la sintaxis CSS selector
- * Cualquier elemento
- E Tipo E para todos los elemento (E, de hecho, puede ser cualquier elemento)
- E: enésima hijo (n) un tipo de E para el elemento, que es el padre n el primer elemento de la sub-elemento
- E: en primer lugar un niño-E tipo de elemento, que es su padre, el primer elemento de la sub-elemento (el equivalente de E: enésima hijo (0))
- E: último hijo E un tipo de elemento, es el elemento de su padre, un hijo del último elemento
- E: sólo un niño-E tipo de elemento, que es el único hijo de su padre elemento del elemento
- E: vacía de un tipo E de la interfaz de usuario (UI) elemento, no sub-elemento (incluido el texto del elemento)
- E: E permitido un Tipo de interfaz de usuario (UI) elemento, que se establece para prohibir la (desactivada)
- E: E discapacitados un tipo de interfaz de usuario (UI) elemento, es configurado para permitir (habilitado)
- E: un control de tipo E de la interfaz de usuario (UI) elemento, que es seleccionado (comprobado) estado (para botones y casillas de verificación)
- E: seleccionada para el tipo E una interfaz de usuario (UI) elemento, se trata de una elección (seleccionados) estatal (en la gama de opciones, una alternativa más o elemento). Atención: propiedades seleccionadas en el CSS no es la norma, pero la prestación de apoyo interno para jQuery
- E E.myclass un tipo de elemento, es la clase de "myClass"
- E # E myid un tipo de elemento, es la identificación de "myid"
- E: no (s) de un tipo E para el elemento, y se centran en los resultados del elemento no coincide con (no incluido) selector s (utilizado como un filtro)
- EF una F para el tipo de elemento, que es el tipo de elemento para el elemento E descendientes (a la atención de los hijos y nietos es el elemento)
- E> F una F para el tipo de elemento, que es el tipo de elemento para el E-elemento (la atención es el sub-elemento)
- E + F a F tipo de elemento, que es seguido en el tipo de elemento para el E detrás de un hermano elemento (tenga en cuenta que F es el hermano de la E-nodo, y está siguiendo de cerca la una posterior)
- E ~ F una F para el tipo de elemento, que es el tipo de elemento para el E detrás de un hermano elemento (tenga en cuenta que F es el hermano de la E-nodo, y la ubicación en la parte trasera de E)
- E, F, G tipo E para el elemento, una F para el tipo de elemento, un tipo de G para el elemento (para el elemento de elección múltiple)
1,2 jQuery apoyo, pero (con las normas CSS) es diferente de la gramática selector
La diferencia es la necesidad de atribuir a añadir símbolos de la antigua "@"
- E [@ foo] E un tipo de elemento, tiene una propiedad "foo"
- E [= @ foo bar] E un tipo de elemento, tiene una propiedad "= foo bar"
- E [@ foo bar = ^] E un tipo de elemento, tiene una propiedad "foo", y su valor de la propiedad son "bar" en el comienzo de la
- E [@ foo = $ bar] E un tipo de elemento, tiene una propiedad "foo", y su valor de la propiedad son "bar" al final de la
- E [*= @ foo bar] E un tipo de elemento, tiene una propiedad "foo", y el valor de los bienes que contiene "bar"
- E [@ foo bar =] [= Baz @ BOP] E un tipo de elemento, tiene una propiedad "= foo bar" y atributos "baz = balanza de pagos"
Nota: La "barra" y "balanza de pagos" son cadenas.
JQuery 1.3 no es compatible con el selector de sintaxis (un poco)
Porque no la práctica, a fin de no entrar en detalles aquí, quisiera conocer los detalles puede referirse a el documento oficial de ayudar.
Anclaje y 1,4 Contex
Contex puede configurarse para ancla (posición) selector, que es jQuery con un patrón diferente CSS. Los usuarios pueden utilizar la sintaxis: $ (expr, el contexto) para establecer el contexto raíz. El valor por defecto contexto raíz de todo el documento.
2. XPath selector (selectores XPath)
JQuer también apoyó la XPath de un selector de la sintaxis. jQuery apoyo a la base de sintaxis XPath. En los siguientes ejemplos para ilustrar.
Ubicación Ruta 2,1 (Ubicación de Senderos)
- Ruta absoluta, en contraposición a la totalidad del documento HTML
$ ( "/ Html / body / / p") $ ( "cuerpo / / p") $ ( "p / .. / div")- La ruta de acceso relativa, en contraposición a establecer el contexto de nodo "este"
$ ( "P / *", este) $ ( "/ p / / A", este)2,2 selector apoyo del Eje
- "/ /": Descendientes de los elementos (div para todos los tipos de p hijos y nietos elementos)
$ ( "/ Div / / p") $("// div / / p ")- "/": Sub-elementos (div para todos los tipos de p sub-elementos)
$("// Dividendo / p ")- "~": Hermano elementos (div todos los tipos de formulario para los hermanos y los elementos)
Dividendo ~ $("// forma ")- ""..": Padre de los elementos (div de la matriz elemento de la p-tipo de elementos)
$("// Dividendo / .. / p ")2.3 Sintaxis de apoyo para el predicado (predicados)
- [@ Foo] tiene los atributos "foo"
Entrada $("// [@ foo] ")- [@ Foo = 'prueba'] tiene los atributos "foo = 'prueba'"
$("// A [@ foo = 'tsxt'] ")- [Nodelist] coinciden con los elementos de sus hijos y nietos Nodelist (para filtrar)
Dividendo $("// [p] ") $("// div [p / a]")2,4 jQuery apoyo, pero (con la especificación de XPath) es diferente de la gramática predicado (predicados)
- [último ()] o [posición () = pasado ()] se convierte en: la última (elección de centrarse en los resultados de la última parte)
$ ( "P: el pasado")- [0] o [posición () = 0] se convierte en: eq (0) o: en primer lugar (la elección de centrarse en los resultados de la primera parte)
$ ( "P: en primer lugar") $ ( "p: eq (0)")- [posición () <5] se convierte en: lt (5) (se centran en los resultados de seleccionar índice superior a 5 elementos)
$ ( "P: lt (5)")- [posición ()> 2] se convierte en: GT (2) (elección del índice es inferior al 2 se centran en los resultados de los elementos)
$ ( "P: GT (2)")Nota: "se convierte" en la parte delantera de la sintaxis XPath de predicados, la parte de atrás es el equivalente de jQuery sintaxis.
3. JQuery costumbre selector (Selectores personalizado)
jQuery tiene una serie de costumbre-la elección de gramática y sintaxis de estas ideas no están en la CSS y la especificación de XPath, pero son bastante fáciles, que llegó a incluir a jQuery.
3,1 costumbre selector (Selectores personalizado)
- : Incluso se centran en los resultados de su índice de los números incluso (incluso) los elementos
- : Impares se centran en los resultados de su índice es un número impar (singular) de los elementos
- : Eq (N) y: enésima (N) elegir a centrarse en los resultados del índice para los elementos de N
- : GT (N) elegir a centrarse en los resultados del índice de los elementos de N
- : Lt (N) elegir a centrarse en los resultados del índice es inferior al N de los elementos
- : En primer lugar la elección de centrarse en los resultados del primer elemento (el equivalente de eq (0) o la enésima (0))
- : Última opción para centrar los resultados del último elemento
- : Los padres a elegir centrarse en los resultados de los elementos, debe ser sub-elementos (incluido el texto del nodo) (con vacíos en contrario)
- : Contiene ( 'test') elegir a centrarse en los resultados de las especificadas texto contiene elementos de la
- : Visible elección puede ser visto todos (visible) de los elementos (las propiedades de pantalla igual al valor de visible, en bloque, en línea, visibilidad o igual al valor de la propiedad visible, no oculto, incluyendo el tipo de elementos (en el tipo oculto, como por ejemplo <input type = "oculto" ... >))
- : Oculto opción para ocultar todos los (visible) de los elementos (las propiedades de pantalla igual al valor de ninguno, visibilidad o igual al valor de los bienes ocultos, no incluye el oculto tipos de elementos (en el tipo oculto, como <input type="hidden" …>))
Ejemplos:
$ ( "P: en primer lugar"). Css ( "fontWeight", "negrita"); $ ( "div: oculto"). Mostrar (); $ ( "/ div: contiene ( 'test')", este). hide ();3,2 selector (formulario selectores)
- : De entrada para elegir la forma de todos los elementos (de entrada, seleccionar, de texto, botones)
- : Texto seleccionar todos el campo de texto (type = "text").
- : Opción de contraseña para todas las contraseña de dominio (type = "contraseña").
- : Radio todos los botones para elegir (type = "radio").
- : Casilla de verificación para elegir todas las casilla de verificación (type = "casilla").
- : Botón de enviar para presentar todas las opciones (type = "submit").
- : La imagen de todas las imágenes para elegir dominio (type = "image").
- : El botón para restablecer todas las opciones (type = "reset").
- : Para seleccionar todos los botones (type = "botón").
- : Seleccionar todos los archivos <input type="file">.
: Oculto también está disponible en el punto 3.1 anterior han introducido.
En la forma propuesta el uso de opciones para proporcionar un contexto raíz, ejemplos:
$ ( '# MiFormulario: de entrada')$ ( 'Input: radio ", MiFormulario)Por último, la declaración anterior y su partido se seleccione todos "MiFormulario" en la forma de todas las emisoras de radio botón, lo que equivale a [@ type = radio] (es decir, $ ( "[type = radio], MiFormulario")), pero el cuadro De un solo selector será un poco más rápidamente, sobre todo a gran escala de forma.
Más 3,3 Selector
jQuery selector se puede extender a terceros plug-ins:
- Más selectores plugin
- Mike Alsup en la costumbre selectores
- Parche para permitir la selección por la propiedad CSS (full plugin para ser puesto en libertad al mismo tiempo que 1,1)
Referencia:
http://docs.jquery.com/DOM/Traversing/Selectors
(2 votos, promedio: 5 de 5) - Acogió con beneplácito la calificación para este artículo
Cargando ... No donaciones en los últimos 180 days.Who hacer donación de dejar mensaje aquí. Donar Ahora.Este es un wordpress plugin Wp-donantes. Proporciona una función de donación inteligentes para el patrocinador autoleave información contenida en este recipiente después del pago. La gente puede donar y presentar el nombre o la dirección URL o TextLink AD. La información de los donantes más recientes se muestran en la nube. La más de una persona dona, el más grande de su vínculo be.It 's apoyará más popular interfaz de pago en el futuro. ParPal Sólo la primera. .. MásPowered By: WP-donantesRelacionados con el registro de
En este documento, los lectores también están preocupados por el texto siguiente:
- N / A
21 de julio, 2008 Autor: Eric | Codificación | Trackback | No hay comentarios |
| 147 visitas
Deje una respuesta