Indholdsfortegnelse
Disse elementer eller selektorer kan manipuleres med Jquery og css for at skabe effekter og opnå indhold, skjule det eller tilføje det og anvende en vis effekt på det, hvilket letter programmereres arbejde. Nogle vælgere er bedre kendt for css -koden for eksempel:IDENTIFIERE
De er element i det højeste hierarki og definerer generelle parametre for elementerne i en blok. De er defineret som #id og anvendes normalt på lister eller blokke.
Dette er afsnittet id -vælger
Afsnit uden vælger
LEKTIONER
De er elementer i lavere hierarki og bruges til individuelle elementer eller til at definere klasser inden for en identifikation, såsom:
Dette er afsnittet id -vælger
Blåt afsnit med s
Blåt afsnit med divRødt afsnit med div
Selvom den uafhængige klasse .parrafoazul kan anvende element p, der ikke er afhængig af nogen, kan vi endda anvende det på andre elementer som div, men hvis vi forsøger at anvende parraforojo -klassen uafhængigt af #paragraph -id'en, vil vi se, at det gør det virker ikke, da det ikke opfylder det hierarki, der pålægger dets identifikator #paragraph.
Der er mange selektorer, som vi kan bruge her, vi vil se nogle
Selv (lige) og ulige (ulige) vælger
Denne vælger anvendes på en række elementer, der bruger samme klasse, og den kan påvirke lige eller ulige elementer, for eksempel farver vi baggrunden på en liste over afsnit.
AFSNIT
Bruger 1 har efterladt en besked
Bruger 2 har efterladt en besked
Bruger 3 har efterladt en besked
Bruger 4 har efterladt en besked
UL LISTE
- Bruger 1 har efterladt en besked
- Bruger 2 har efterladt en besked
- Bruger 3 har efterladt en besked
- Bruger 4 har efterladt en besked
VÆLGER FØRST (Første) OG SIDSTE (Sidste)
Disse vælgere giver os mulighed for at manipulere det første og det sidste element i en bestemt liste, for eksempel sætter vi listen i gråt, det første element i grønt og det sidste element i blåt.
UL LISTE
- Bruger 1 har efterladt en besked
- Bruger 2 har efterladt en besked
- Bruger 3 har efterladt en besked
- Bruger 4 har efterladt en besked
FOKUSVÆLGER
Fokus på et element aktiveres, når du klikker på et element og deaktiveres, når du klikker på et andet område på nettet eller på et andet element. Vi vil se et eksempel med en loginformular, vi opretter klassen .focologin og derefter anvender vi det på identifikatoren for #login -formularen for at påvirke alle de elementer, den indeholder. Vi kan også anvende det på et lag eller div -blok og placere formen inde i blokken.
FORM
Brugeradgangskode:
Tildel eller rediger en css -stil til et element med AddClass
Hvis vi vil tildele en css -stil dynamisk eller ændre i henhold til en bestemt betingelse, vil vi bruge AddClass. I dette tilfælde har vi en klasse .grøn knap, og til inputtypeteksten tildeler vi klassen .box fra Jquery. Indtastning af kodeordstype påvirkes ikke, og send -knappen påvirkes heller ikke, da vi ikke har tildelt dem nogen css -klasse.
TILMELDINGSBLANKET
Navn:
Adresse:
Telefon:
E-mail:
Denne vælger gør det muligt at identificere et element i en matrix af elementer i henhold til den position, hvor en tabelcelle er, for eksempel skal vi huske på, at elementerne er angivet som indekser for en matrix, der starter med 0,1,2 osv. .
| Afsnit A | Afsnit B | Afsnit C |
|---|---|---|
| Celle 0 | Celle 1 | Celle 2 |
| Celle 3 | Celle 4 | Celle 5 |
Fortsætter vi med tabellerne og anvendelsen af selektorer, vil vi se, hvordan du opretter et baggrundsdesign på en vekslende måde i farverne på rækker i en tabel, svarende til det, der tidligere blev anvendt med afsnit og lister. Vi tilføjer ikke så meget css eller design, så effekten i bund og grund bliver bedre værdsat.
VÆLGER n-barn
Fortsat med det foregående eksempel kan vi bruge nth-child selector som et komplement, svarende til eq selector, men forskellen er, at med nth-child kan positioner angives i form af en aritmetisk operation. Det bruges til at vælge et eller flere elementer, men med den betingelse, at det er det niende barn af dets forælder. Denne vælger er nyttig til at vælge det andet afsnit i en blok eller det tredje element på en liste osv. Elementerne tages ikke som en array, men i rækkefølge først, andet osv.
For eksempel, hvis vi tilføjer i det forrige script
Ulige kolonner vælges i dette tilfælde
- Ulige kolonner nth-barn (2n + 1)
- Parrede kolonner nth-child (2n)
- Første og fjerde kolonne n-barn (3n + 1)
