The pripravený() funkcia v jQuery vykoná kód iba vtedy, keď je plne načítaný DOM (Document object model). Je to vstavaná funkcia v jQuery. Môže sa spustiť pred načítaním všetkých obrázkov atď., ale iba vtedy, keď je pripravený DOM. Kód vložený medzi $(document).ready() sa spustí iba vtedy, keď je stránka pripravená na spustenie kódu JavaScript.
Nemali by sme používať pripravený() metóda spolu s .
Syntax
Môžeme použiť pripravený() fungovať dvoma spôsobmi, ako je uvedené nižšie.
- Bežne používaná syntax of pripravený() funkcia je nasledovná.
$(document).ready(function)
- Ako môžeme použiť pripravený() funguje len pre aktuálny dokument, takže volič je možné preskočiť. Vyššie uvedenú syntax môžeme napísať aj nasledovne.
$(function)
Oba vyššie uvedené spôsoby sú platné na použitie. Druhá syntax môže byť použitá ako alternatíva k prvej syntaxi. Môže to byť jasné z nasledujúceho kódu.
$(document).ready(function() { $('p').css('color', 'red'); }); Vyššie uvedený kód je ekvivalentný nižšie uvedenému kódu.
$(function() { $('p').css('color', 'red'); }); Niektorí skúsení vývojári používajú skratku $() skôr ako používať $(document).ready(), ale ak píšeme kód pre neskúsených ľudí, tak je lepšie použiť dlhý tvar.
Hodnoty parametrov
The pripravený() funkcia má iba jednu hodnotu parametra definovanú nasledovne.
funkcia(): Je to povinný parameter, ktorý určuje funkciu, ktorá sa vykoná po načítaní dokumentu.
Pozrime sa na príklad použitia $(document).ready() funkciu.
Príklad
V tomto príklade sú niektoré prvky odseku a tlačidlo. Tu používame $(document).ready() funkcia na zmenu štýlu daných odsekov.
jQuery ready() function $(document).ready(function(){ $('button').click(function(){ $('#p1').css({'font-size': '30px', 'color': 'blue', 'background': 'yellow', 'fontWeight': 'bold'}); $('#p2').css({'fontSize': '20px', 'fontWeight': 'bold', 'color': 'red'}); $('#p3').css({'color': 'blue'}); }); }); <p id="p1"> Welcome to the javaTpoint.com </p> <p id="p2"> This is an example of using the $(document).ready() function. </p> <p id="p3"> This is a third paragraph element </p> <p> Click the following button to see the effect. </p> Click me Vyskúšajte to Výkon:
Po vykonaní vyššie uvedeného kódu bude výstupom -
Po kliknutí na dané tlačidlo bude výstup -
