Le prêt() La fonction dans jQuery exécute le code uniquement lorsque le DOM (Document Object Model) est entièrement chargé. C'est une fonction intégrée à jQuery. Il peut se déclencher avant le chargement de toutes les images, etc. mais seulement lorsque le DOM est prêt. Le code inséré entre $(document).prêt() est exécuté uniquement lorsque la page est prête à exécuter le code JavaScript.
Nous ne devrions pas utiliser le prêt() méthode avec le .
Syntaxe
Nous pouvons utiliser le prêt() fonctionnent de deux manières, comme indiqué ci-dessous.
- La syntaxe couramment utilisée de le prêt() la fonction est la suivante.
$(document).ready(function)
- Comme on peut utiliser le prêt() ne fonctionne que pour le document actuel, le sélecteur peut donc être ignoré. Nous pouvons également écrire la syntaxe ci-dessus comme suit.
$(function)
Les deux méthodes ci-dessus sont valables. La deuxième syntaxe peut être utilisée comme alternative à la première syntaxe. Cela ressort clairement du morceau de code suivant.
$(document).ready(function() { $('p').css('color', 'red'); }); Le code ci-dessus est équivalent au code ci-dessous.
$(function() { $('p').css('color', 'red'); }); Certains développeurs expérimentés utilisent le raccourci $() plutôt que d'utiliser $(document).ready(), mais si nous écrivons le code pour des personnes non expérimentées, il est préférable d'utiliser la forme longue.
Valeurs des paramètres
Le prêt() La fonction n’a qu’une seule valeur de paramètre définie comme suit.
fonction(): C'est le paramètre obligatoire qui spécifie la fonction qui s'exécute après le chargement du document.
Voyons un exemple d'utilisation de $(document).prêt() fonction.
Exemple
Dans cet exemple, il y a quelques éléments de paragraphe et un bouton. Ici, nous utilisons $(document).prêt() fonction pour changer le style des paragraphes donnés.
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 Testez-le maintenant Sortir:
Après l'exécution du code ci-dessus, le résultat sera -
Après avoir cliqué sur le bouton donné, la sortie sera -
