5 Alkalmazási példák jQuery funkció

JQuery minden funkció használható át iterációt egy jQuery objektumot. Ez egy vagy több DOM elemeket, és minden jQuery funkciókat. Továbbá jQuery biztosít egy kiegészítő funkciója az azonos nevű, amit okozhat előzetes kiválasztását vagy létrehozását DOM elemeket. Nézzük többet megtudni erről.

A szintaxis jQuery .Minden ()

A következő példában, akkor válassza ki a weboldal összes div elem és levezetni az index, és egy azonosító mindegyikük. Lehetséges eredmény: "div0: header", "div1: test", "DIV2: footer". A példa jQuery egyes () függvény. támogatása helyett:

A következő példa bemutatja a használata a kiegészítő funkciót. Ebben az esetben a tárgy, amelyre a hurok be van állítva, mint az első érv. Ez a példa megmutatja, hogyan kell rendezni a tömböt a hurkon keresztül jQuery egyes funkciók:

A legutóbbi jQuery egyes Például, azt akarom, hogy vezessenek be végighalad a egy objektum tulajdonságait:

Az egész jön le, hogy a megfelelő képződését a visszahívás. A visszahívás keretében megegyezik ezzel a második érv, ami az aktuális értéket. De mivel az összefüggésben mindig egy objektumot, az egyszerű értékeket kell „csomagolni”. Ezért szigorú közötti egyenlőség az érték és a kontextus nem lehet megadni. Az első érv - az aktuális index, amely az a szám a jQuery egyes tömb vagy string (objektumok).

  1. A legfontosabb példa a jQuery funkció .Minden ()

Lássuk, hogyan each () függvényt használjuk együtt a tárgy jQuery. Az első példában, minden elem a kiválasztott oldalon, és megjeleníti azokat attribútum href:

A második példában a jQuery minden objektum megjelenik az összes külső href egy weblapon (azzal a feltétellel, hogy a HTTP protokoll):

Tegyük fel, hogy az oldal az alábbi linkeken:

A második kód ad:

Az elemek a DOM objektumot jQuery belül minden () szükséges újra „wrap”. Mert jQuery - ez valójában egy tartályt egy sor DOM elemek. A rendszer segítségével a jQuery minden feladatra a tömb kezelik ugyanaz, mint a normális. Ezért nem kap csomagolva a terméket közvetlenül a kezelés után.

  1. Példa array jQuery.each ()

Ismét, nézd meg, hogyan lehet kezelni a szokásos sor:

A kimenet a kód: 0: 1, 1: 2, 2: 3, 3: 4, 4: 5 és 5: 6.

A tömb tartalmaz numerikus indexek, így kapunk egy számot, kezdve 0 N - 1. ahol N - elemek száma a tömbben.

Lehet, hogy bonyolultabb adatszerkezetek, mint a tömbök, tömbök, objektumok a tárgyakat, tömbök tárgyak, vagy a tömbben. Lássuk, hogyan jQuery megtalálják egymást lehet használni ezeket a forgatókönyveket:

Az eredmény a kód: piros = # F00, zöld = # 0f0, kék = # 00F.

Kezeljük szerkezet segítségével beágyazott hívás each (). Külső hívás kezeli a tömb változó JSON. belső hívás feldolgozása tárgyakat. Ebben a példában minden jQuery minden elem csak egy gombot. De kód használatával a bemutatott lehet állítani, hogy tetszőleges számú kulcsokat.

Ez a példa azt mutatja, hogyan kell rendezni minden eleme osztályú productDescription:

Együtt a választó, használjuk a segítő funkciót each () módszer helyett az each ():

Az eredmény az a jQuery egyes funkciók a következő: 0: Red. 1: Orange. 2: Green.

Nem kell használni az index és az érték. Ezeket a paramétereket, amelyek segítenek meghatározni, hogy melyik DOM elem jelenleg feldolgozás során. Ezen túlmenően, a forgatókönyvet, akkor egy sokkal kényelmesebb módszer minden ():

Be kell, hogy lezárja DOM elem az új jQuery példány. Mi használjuk a szövegben () metódus, hogy a szöveg elem.

  1. Például késleltetés keresztül jQuery.each ()

Ebben a jQuery egyes Például, ha a felhasználó megnyomja az elemet az azonosító 5demo. minden eleme a lista narancs. Késleltetési idő után függ az index (0, 200, 400 milliszekundum) fokozatosan elrejtik elem:

következtetés

Javasoljuk, hogy a jQuery egyes funkciók. amikor csak lehetséges. Ez megoldja a sok probléma! Beyond jQuery fejleszteni jobb felhasználását foreach () függvény minden tömb ECMAScript 5.

Ne feledje: $ .Minden () és a $ (választó) .Minden () - ez két különböző meghatározott módszerek különböző módon.

Fordítása a cikk „5 jQuery each () függvény példák» Web design csapat barátságos projekt tól Z-ig

Kapcsolódó cikkek