Basics jquery, webreference
jQuery könyvtár segítségével könnyedén manipulálni a HTML kódot után jelenik meg a böngészőben. Azt is előírja eszközök segítségével a felhasználók kölcsönhatásba az oldalon; eszközök segítségével animációkat készíthetnek; és eszközöket, amelyek lehetővé teszik, hogy kommunikálni a szerverrel nélkül betölteni az oldalt. Hamarosan előtt minden odaér. Kezdeni, úgy néhány alapjait jQuery és jQuery is alkalmazza a fő feladat: hogy néhány elemet, és valamit csinálni velük.
Ez a leírás feltételezi, hogy Ön ismeri a HTML és CSS szelektor. Ha nem tudja, hogyan használja szelektor speciális elemeket, meg kell tölteni egy kis időt, és gyorsan bejutni a hinta a dolgok, mielőtt elkezdi alkalmazni ezt a kalauz.
Miért $, és nem valami mást?
jQuery könyvtár jQuery funkció. amely lehetővé teszi, hogy kiválassza elemek használatával CSS választók.
Persze, ha már láttam az összes jQuery-kód, akkor valószínűleg jobban hozzászokott ehhez hasonló:
$ (Document) .ready ()
Mielőtt a biztonságos használat jQuery elvégezni semmit az oldalon, győződjön meg arról, hogy az oldal egy olyan államban, ahol kész manipuláció. JQuery, meg kell tenni a kódot egy függvény, akkor ezt a funkciót $ (document) .ready (). Mint látható, az általunk használt egy névtelen függvényt.
Ha a dokumentum elkészült, végrehajt egy funkciót, amit át kell adni a .ready (). Mi folyik itt? Az általunk használt $ (document) A dokumentum létrehozásához jQuery-objektumot. majd hívja a .ready () függvény erre az épületre, és átadja neki a funkciót akarunk végrehajtani.
Mivel ez gyakran, amikor megállapítják, akkor adott esetben a rövidített eljárás - $ () függvény kettős feladatot egy álnevet a $ (document) .ready (). Ha át a funkciót:
További ebben a kézikönyvben feltételezzük, hogy a tárgy van zárva kód $ (document) .ready (function ()). de ez a rész nem javallt a rövidség kedvéért.
Kapunk néhány eleme
A legegyszerűbb dolog, amit tehetünk jQuery - az, hogy néhány elemet, és valamit ezek teljesítésére. Ha ismeri a szelektor CSS, hogy önkényes elemek nagyon egyszerű: egyszerűen át a megfelelő állásba $ ().
Fontos megérteni, hogy minden minta termel fogja tartalmazni azokat az elemeket, az oldalon található idején a kiválasztás. Más szóval, ha írsz var horgonyok = $ ( 'a'). majd később hozzá még egy elemet az oldalához, majd a változó horgonyok nem fogja tartalmazni az új elem.
Más módon, hogy hozzon létre egy jQuery objektumot
Ezt az egyszerű átviteli választó $ (). létrehozhat egy jQuery objektumot más módon:
Saját minta valamit?
Néha meg kell csinálni valamit csak amikor kiválasztja megfelel több elem. Mivel a függvény $ () mindig visszatér a jQuery objektumot, és ez mindig igaz. ellenőrizni kell az Ön minta, annak megállapítására, hogy volt valami talált.
Figyelem! helytelen kód
Csökkenteni tudjuk a vizsgálat még, ha arra gondolunk, hogy a 0 hamis érték:
Előállítása az egyes elemek a minta
Ha meg kell dolgozni az eredeti DOM elem a mintában, meg kell, hogy hozzáférjenek egy elemet a jQuery objektumot. Például, ha azt szeretnénk, hogy közvetlenül hozzáférjenek a value tulajdonság az elem . annak szükségességét, hogy működjön együtt az eredeti elem DOM.
Fontos tudni, hogy nem hívja jQuery módszerek nyers DOM elemeket. Ezért a következő példa nem fog működni:
Ha meg kell dolgozni egy eleme egy mintában, és szeretné használni jQuery módszerek ezt az elemet, akkor kap egy új jQuery objektumot tartalmazó egyetlen elem révén .eq (). halad, hogy az index.
Új elemek
A függvény $ is az utolsó rész: az új elemeket. Ha a $ () vezetjük HTML fragment, akkor hozzon létre egy új elem a memória - más szóval, az elem jön létre, de nem adunk az oldalt, amíg meg nem.
Ön is létrehozhat egy elemet átadásával egy objektum információt annak létrehozása:
Nézzük meg, hogyan kell hozzáadni elemeket az oldalra létre a következő részben, melynek középpontjában a mozgás a dokumentumot, és manipulálja őket c.
Munka a minta
Miután létrehozott egy jQuery objektumot tartalmazó választással, akkor érdemes valamit csinálni vele. De előtte, nézzük meg néhány olyan alapelv, amelyek kulcsfontosságúak a megértés mitől jQuery.
minta ellenőrzése
Mi lehet meghatározni, hogy a minta megfelel bizonyos feltételeknek, a .ie () metódust. Ez a módszer a leggyakrabban használt, hogy egy választó, mint az egyetlen érv. Ez visszatér igaz vagy hamis attól függően, hogy a minta választó felel meg:
Azt is át egy módszer .ie () jQuery objektumot, az eredeti DOM elem, vagy akár a funkció, ha szüksége van egy átfogó vizsgálatot. Lásd a dokumentációban talál.
Beszerzése, telepítése és implicit felsorolás
Implicit felsorolás azt jelenti, hogy a jQuery automatikusan felsorolja mindazokat az elemeket a mintában, ha hívja a létrehozó mintavételi módszer. Ez azt jelenti, hogy ha azt akarjuk, hogy tegyen valamit az összes elemet a mintában, akkor ne hívja a módszer minden elemet a minta - csak hívja eljárás maga a minta és a jQuery kezeli tételek az Ön számára.
Tegyük fel, hogy azt szeretné, hogy módosítsa a HTML az összes listaelem oldalon. Ehhez fel kell használni a .html () metódus, hogy módosítsa a HTML az összes kijelölt elemek listája.
Azt is át egy funkciót jQuery szerelés módja. A visszatérési értéke ezt a funkciót használják, mint az új értéket, és két paramétert fogad: az index az elem a mintát és a régi érték, amit próbál változtatni. Ez akkor hasznos, ha információra van szüksége a jelenlegi állapot az elem, annak érdekében, hogy megfelelően létrehozza az új állam.
túlzás
Előfordul, hogy a problémát próbálják megoldani, nem illenek a meglévő jQuery technikák és akkor meg kell tennie, hogy túl sok mintát módszer .Minden (). Az alábbi kódot a lista elején elem, azt a címkét tartalmazó listát az index.
Az egyik leginkább jövedelmező részeit jQuery, hogy képes „horog” módszer helyett. Ez azt jelenti, hogy nyugodtan nevezhetjük egy sor módszer minta nélkül ismétlés vagy visszatartás mintát egy változó. Azt is, hogy az új minta alapján az előző és minden törés nélkül a lánc.
Láncok lehetséges, mert minden beállítást jQuery eljárás visszatér a minta, amelyre beidézték. Ez egy rendkívül erős vonás, és sok könyvtár vett a fedélzetre. Ugyanakkor meg kell óvatosan kell alkalmazni. Lánchálózataival teheti a kódot nagyon nehéz olvasni, módosítani, és a hibakeresés. Nincsenek szigorú szabályok, milyen hosszú legyen a lánc, de még egy egyszerű karakterlánc felett valószínűleg refactor az olvashatóság.
Nagyon jól éreztük magunkat áttekintést ad a kullancsok jQuery. A következő részben megnézzük, hogyan is kezdődik, hogy befolyásolja a különböző dolgokat!