Perché abbiamo bisogno e come registrare JQuery selettore?
Moderna web designer dovrebbe non solo padroneggiare le basi del codice HTML, CSS e JavaScript, ma anche essere in grado di lavorare nella libreria JQuery, che si concentra sulla interazione di JavaScript con HTML-documenti. Questo permette un rapido accesso a qualsiasi elemento DOM (application programming interface che permette di accedere a contenuti HTML-files) e manipolarle. Le principali unità strutturali della biblioteca sono la squadra. Al fine di applicare una o l'altra squadra, è necessario un JQuery-selettore.
selettori formula nella libreria jQuery
I selettori in jQuery basati sull'uso di CSS. Essi sono tenuti a selezionare gli elementi file HTML, di usarle per causare questi o altri metodi di essi (la squadra) manipolazione. La ricerca viene effettuata tramite la funzione di selezione $ (). Ad esempio, $ ( 'div').
I selettori possono essere classificati a seconda di come la selezione di elementi:
- di base;
- per attributo;
- la gerarchia;
- il contenuto;
- sulla situazione;
- scelta dei campi del modulo;
- altri.
selettori a chiave
Nel 90% dei casi quando si utilizza questa libreria è utilizzata JQuery selettore appartenente al gruppo principale. Tutti loro sono abbastanza semplici e chiare. Consideriamo ciascuno di essi:
- * – seleziona tutti gli elementi della pagina, tra cui la testa, il corpo, ecc;.
- p / div / barra laterale / … – seleziona tutti gli elementi relativi al tag prestabilito (cioè p.div, barra laterale, ecc …);
- .myClass / p.myClass – seleziona gli elementi con il nome della classe specificato;
- # MyID / p # myID -. Consente di selezionare qualsiasi oggetto con il dato ID.
Ecco un esempio. Diciamo che abbiamo bisogno di selezionare tutti gli elementi della pagina con l'ingresso di classe par saranno i seguenti: (. Par) $. Se necessario solo elementi p di questa classe, quindi scrivere: $ (p.par).
selettori di attributo
È possibile utilizzare il selettore principale JQuery, se abbiamo bisogno di selezionare un elemento appartenente a qualsiasi classe avere ID o selezionare tutti gli elementi della pagina. Tuttavia, ci sono casi in cui un elemento non ha classe o ID. E 'per questo e ci sono selezioni di attributo. Essi consentono di effettuare una selezione su alcuni attributi degli elementi HTML, come ad esempio href o di src. Questo attributo è scritto in parentesi quadre [].
L'esempio più semplice: $ ([fonte]) – seleziona tutti gli elementi che hanno l'attributo src. E 'possibile restringere il campione specificando certo valore di attributo: $ ([src = 'http: // sito / article / 132222 / valore']).
È possibile utilizzare alcuni selettori JQuery se si vuole restringere il campo di scelta. Ad esempio, $ (p [color = blue] [size = 12]) – sono selezionati solo gli elementi p, che hanno un colore blu e taglia 12.
I selettori contenuti
In tal caso, se non è possibile selezionare gli elementi in base agli attributi o selettori di base, è necessario fare riferimento al loro contenuto. In totale ci sono 4 selettore di questo tipo:
- : Contiene – seleziona le voci che contengono il testo specificato;
- : Ha – seleziona gli elementi che contengono altri elementi caratteristici della linea;
- : Parent – seleziona gli elementi che contengono tutte le altre;
- : Empty – seleziona gli elementi che non contengono alcun altro.
Ecco un esempio. Per selezionare tutti gli elementi div, che contiene il testo del Ciao, è necessario scrivere $ (div: contiene ( 'Ciao')).
gerarchia selettori
C'è un altro modo per selezionare gli elementi in jQuery, vale a dire – secondo la loro gerarchia (cioè il rapporto tra l'altro sulla pagina HTML). Molti di loro, in modo da presentare due dei più popolari, "bambino" e "discendente".
Nel primo caso sono selezionati gli elementi, che sono diretti discendenti (figli) di un dato elemento (antenato). Ad esempio, per selezionare gli elementi della lista in classe luce che è un elenco bambino nav, allora avete bisogno di scrivere: $ (ul # nav> li.light).
Il secondo caso – un più generale. Ci possono essere selezionati e discendenti indiretti dell'elemento. Ad esempio, per selezionare i collegamenti all'interno della lista nav prescrivono: $ (ul # nav a).
Così, in JQuery elementi possono essere selezionati in vari modi utilizzando i parametri ad esempio una classe, ID, gli attributi, il contenuto o la gerarchia di elementi HTML-documento.