Zer da beharrezkoa eta nola idatzi jQuery hautatzailea?

Web-diseinatzaile modernoak ez ditu HTML, CSS eta JavaScript-en oinarrizkoak bakarrik ezagutzen , baina jQuery liburutegian lan egiteko gai izan behar du HTML dokumentuen JavaScript-ekin elkarrekintzan oinarritzen dena. DOM elementu guztiak azkar eta modu errazean (html-fitxategien edukia sartzeko irekitako programa-interfaze) maneiatu ahal izango duzu. Liburutegi honen egituraren unitate nagusiak taldeak dira. Komando hau edo hori aplikatzeko, jQuery-selector bat behar duzu.

Aukeratzaileen formula jQuery liburutegian

JQuery hautatzaileak CSS-en erabilitakoak dira. HTML fitxategiaren elementuak hautatzeko beharrezkoak dira, horiek manipulatzeko (komandoak) modu batean edo bestera deitzeko erabili ahal izateko. Hautatu selekzioa $ () funtzioaren bidez egiten da. Adibidez, $ ('div').

Hautagailuak elementuen arabera hautatuak izan daitezke:

• oinarrizko;
• Atributuaren arabera;
• Hierarkia arabera;
• Edukiaren arabera;
• Jarrera;
• Inprimakiaren eremu hautapena;
• beste batzuk.

Oinarrizko hautagailuak

Liburutegi honekin lanean diharduten kasuen% 90ean, jQuery hautatzailea erabiltzen da talde nagusian. Horiek guztiak nahiko sinpleak eta ulergarriak dira. Ikus dezagun horietako bakoitza:

• * - Orriaren elementu guztiak hautatzen ditu, burua, gorputza, eta abar barne;
• P / div / sidebar / ... - emandako etiketa duten elementu guztiak hautatzen ditu (hau da, p.div, alboko barra, eta abar);
• .myClass / p.myClass - hautatutako elementuak zehaztutako klasearen izenarekin hautatzen ditu;
• # MyID / p. # MyID - elementu bat hautatutako IDarekin hautatzen du.

Demagun adibide bat. Esan dezagun orri bateko elementu guztiak par klasearekin hautatu behar ditugula, sarrera itxura hau izango da: $ (.par). Klase honetako p osagaiak bakarrik behar badituzu, idatzi: $ (p.par).

Atributu hautagailuak

JQuery hautatzaile nagusia erabil daiteke ID bat duen klase bateko elementu bat hautatzeko edo orriaren elementu guztiak hautatzeko. Hala ere, nahi dituzun elementuak ez du klase edo ID bat izaten. Hori dela eta, aukeratzaileak atributuaren arabera daude. HTML elementu baten atributu batzuk erakusteko aukera ematen dute, adibidez, href edo src. Atributu hau kortxete artean idatzita dago [].

Adibide sinpleena: $ ([src]) src atributua duten elementu guztien hautapena da. Lagun eremua murriztu dezakezu atributuaren balio jakin batera: $ ([src = 'http: // site / article / 132222 / value']).

Aukeraz hauta ditzakezu JQuery-n, hautapen-eremua estutu behar baduzu. Adibidez, $ (p [kolorea = urdina] [tamaina = 12]) - urdinak eta tamaina 12 diren elementuak bakarrik hautatuko dira.

Edukiaren hautagailuak

Elementuak hautatzeko gai ez diren atributuak edo hautagailu nagusiaren arabera, merezi du haien edukia aipatzea. 4 motako hautagailuak daude:

• : Biltzen ditu - zehaztutako testua duten elementuak hautatzen ditu;
• : Has - lerro horren espezifikoak diren beste elementu batzuk dituzten elementuak hautatzen ditu;
• : Guraso - beste batzuek dituzten elementuak hautatzen ditu;
• : Hutsik: beste batzuek ez dituzten elementuak hautatzen dituzte.

Demagun adibide bat. Hello testuari dagokion div elementu guztiak hautatzeko, $ (div: contains ('Hello') idazketa idatzi behar duzu.

Jerarkiaren hautagailuak

JQuery-en elementuak hautatzeko modu bat gehiago dago, hots, beren hierarkian oinarrituta (hau da, HTML orriko elkarren arteko harremana). Horietako asko daude, beraz, hona hemen bi ezagunenak: "haur" eta "seme-alaba".

Lehenengo kasuan, emandako elementu zuzeneko ondorengoak (haurraren) elementuak (arbaso) hautatzen dira. Adibidez, argizko klasean elementu zerrenda hautatzeko, hau da, nav zerrendaren haurrena: $ (ul # nav> li.light) idatzi behar duzu.

Bigarren kasua orokorrago da. Hemen, elementu baten ondorengo ondorengoa ere hautatuta egon daiteke. Adibidez, nav zerrendako estekak hautatzeko, idatzi egingo dugu: $ (ul # nav a).

Horrela, JQuery-n, elementuek modu ezberdinetan hautatzeko aukera ematen dute, hala nola, dokumentuaren, IDaren, atributuen, edukiaren edo HTML dokumentuaren elementuen hierarkia.