Toinen konseptivideo! Tämä on "vain yksi niistä asioista", jotka sinun on ymmärrettävä jQueryssä. Se on itse asiassa hieman ainutlaatuinen jQuerylle, koska muut aikaisemmat suositut JavaScript-kirjastot eivät ole tehneet sitä tällä tavalla.
Olemme jo käsitelleet valitsimia melko vähän. Esimerkiksi tiedät jo, että $("p")se valitsee kaikki sivun kappaleet. Ei vain ensimmäinen tai joku satunnainen, ne kaikki. Voit helposti kuvitella, että sivulla voi olla monia näistä. Kuvittele nyt, mitä tapahtuu, kun teet:
$("p").hide();Kaikki heistä piilotetaan oikein? Aivan. Ei ensimmäinen tai jokin satunnainen, ne kaikki. Tämä implisiittinen iterointi . Kulissien takana jQuery silmukkaa automaattisesti läpi kaikki löytämänsä elementit ja suorittaa heille valitsemasi menetelmän. Meidän ei kirjaimellisesti tarvitse kirjoittaa silmukkaa itse tehdäksemme tämän. Vaikuttaa melko ilmeiseltä, jos olet tutustumassa JavaScriptiin jQuery, mutta monet kirjastot ovat aiemmin vaatineet, että siirryt itse elementtikokoelmiin.
Jos haluat, voit silti kirjoittaa silmukan itse. Se näyttäisi ehkä tältä käyttämällä jQuery-silmukointimenetelmiä:
$("p").each(function() ( $(this).hide(); ));Se on suunnilleen sama asia. Ei välttämättä, mutta voit. Se on selkeä iterointi .
Joskus sinun on tehtävä selkeä iterointi. Pohjimmiltaan, jos meidän on käytettävä arvoa thisja tehtävä jotain erityistä sen kanssa, tarvitsemme oman silmukkarakenteemme toimiakseen.
Tämän näyttöruudun esimerkki oli luettelomerkkien merkkien laskeminen ja liittäminen merkkijonon loppuun. Tarvitsemme siihen nimenomaisen toistamisen.
Katso Chris Coyierin (@chriscoyier) kynä 4b53b9f55662d0d26339e18277500eee CodePeniltä
Tässä käytimme jQueryn jokaista () -menetelmää, joka on täydellinen tarvitsemallemme. Hyödyllinen bitti, jonka se tekee meille, on antaa meille nolla-indeksoitu laskuri jokaiselle iteraatiolle, jota voimme käyttää tarvittaessa.
$(".there-are-three-of-me").each(function(i) ( console.log(i); )); // 0 // 1 // 2