Teraz, keď sme sa pozreli na používanie doplnkov jQuery, je absolútne užitočné pochopiť, ako ich tiež vytvoriť. Krátko sme sa dotkli skutočnosti, že natívny objekt jQuery môžete rozšíriť, ak chcete. Rovnako ako:
$.myFunction = function() ( console.log("I am a function on the jQuery object."); ); // call it $.myFunction();
To však samo o sebe nie je zvlášť užitočné. Ak chcete pre jQuery vytvoriť novú metódu, ktorú môžete zavolať na množinu prvkov, musíte to urobiť takto:
$.fn.myMethod = function() ( // I'm a new method ));
Je to úplne to isté ako použitie .prototypu na jQuery a pre zvedavcov si o nich môžete prečítať viac tu. Ak to urobíme týmto spôsobom, znamená to, že budeme môcť použiť túto novú metódu na množinu prvkov. Páči sa mi to:
$("li").myMethod();
Môžete robiť čokoľvek, čo chcete, popri tejto metóde, ale aby ste boli ako dobrý občan vytvárania doplnkov jQuery, mali by ste vrátiť rovnakú sadu prvkov späť z doplnku.
$.fn.myMethod = function() ( // Do some stuff return this; ));
Takto to bude fungovať s reťazením. Ak to neurobíte a niekto skúsil niečo ako:
$ („Li“). MyMethod (). Show ();
To by zlyhalo, pretože .show()
by sa na ne nevzťahovalo v podstate nič. Pluginy jQuery sú často vyrábané tak, aby prechádzali cez každý prvok, aby ste mali priamy prístup ku každému jednotlivému prvku v množine a robili tak, ako potrebujete.
Ďalšou vecou, ktorú musíte urobiť pre dobrého občana, je zabaliť doplnok do výrazu okamžite vyvolanej funkcie a odovzdať do neho parameter jQuery. Takto môžete bezpečnejšie použiť $ vo svojom kóde pluginu. Je to preto, že v niektorých situáciách nie je skratka $ pre jQuery k dispozícii (napr. Používateľ použil jQuery v „režime kompatibility“).
Po zavedení oboch týchto dvoch vecí sa štruktúra doplnku stane:
(function($) ( $.fn.myMethod = function() ( return this.each(function() ( // do things )); ); ))(jQuery)
Na obrazovke sme nakoniec vytvorili jednoduchý doplnok na pridanie šípky na koniec ľubovoľného prvku.
Prezrite si Pen rwasH od Chrisa Coyiera (@chriscoyier) na stránkach CodePen
Samozrejme, môže to byť zložitejšie, pretože vaša ambícia robiť viac bude stúpať.