El llest () La funció de jQuery executa el codi només quan el DOM (model d'objectes de document) està completament carregat. És una funció integrada a jQuery. Es pot disparar abans de carregar totes les imatges, etc., però només quan el DOM estigui llest. El codi inserit entre $(document).preparat() només s'executa quan la pàgina està preparada perquè s'executi el codi JavaScript.
No hem d'utilitzar el llest () mètode juntament amb el .
Sintaxi
Podem utilitzar el llest () funcionen de dues maneres, tal com es mostra a continuació.
- La sintaxi d'ús habitual el llest () funció és la següent.
$(document).ready(function)
- Com podem utilitzar el llest () funció només per al document actual, de manera que es pot ometre el selector. També podem escriure la sintaxi anterior de la següent manera.
$(function)
Les dues maneres anteriors són vàlides d'utilitzar. La segona sintaxi es pot utilitzar com a alternativa a la primera. Pot quedar clar a partir del següent fragment de codi.
$(document).ready(function() { $('p').css('color', 'red'); }); El codi anterior és equivalent al codi següent.
$(function() { $('p').css('color', 'red'); }); Alguns desenvolupadors experimentats utilitzen l'abreviatura $() en lloc d'utilitzar $(document).preparat(), però si estem escrivint el codi per a persones sense experiència, és millor utilitzar el format llarg.
Valors dels paràmetres
El llest () La funció només té un valor de paràmetre definit de la manera següent.
qui és freddie mercury
funció(): És el paràmetre obligatori que especifica la funció que s'executa després de carregar el document.
Vegem un exemple d'ús del $(document).preparat() funció.
Exemple
En aquest exemple, hi ha alguns elements de paràgraf i un botó. Aquí, estem utilitzant $(document).preparat() funció per canviar l'estil dels paràgrafs donats.
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 Prova-ho ara Sortida:
Després de l'execució del codi anterior, la sortida serà -
Després de fer clic al botó donat, la sortida serà -
