En savoir plus sur le rôle de la fonction ready dans jQuery-js tutoriel-php.cn

En savoir plus sur le rôle de la fonction ready dans jQuery

WBOY

Libérer： 2024-02-28 11:48:04

original

843 Les gens l'ont consulté

En savoir plus sur le rôle de la fonction ready dans jQuery

jQuery est une bibliothèque JavaScript populaire largement utilisée pour développer des pages Web interactives et des applications Web. L'une des fonctions importantes est la fonction ready, qui exécute la fonction spécifiée lorsque le document est entièrement chargé et prêt. Cet article approfondira le rôle de la fonction ready dans jQuery et illustrera son utilisation et ses effets à travers des exemples de code spécifiques.

1. Le rôle de la fonction ready dans jQuery

Dans le développement Web, vous devez parfois vous assurer qu'une partie du code JavaScript est exécuté une fois le document complètement chargé pour éviter les erreurs causées par l'exécution du code avant que les éléments de la page ne soient complètement chargés. La fonction ready dans jQuery existe pour résoudre ce problème. Lorsque le document est chargé, c'est-à-dire que la structure DOM est entièrement construite et que toutes les ressources sont prêtes, la fonction ready déclenche la fonction de rappel liée.

2. Comment utiliser la fonction ready dans jQuery

Lorsque vous utilisez la fonction ready de jQuery, vous pouvez exécuter la fonction de rappel des manières suivantes :

(1) Utilisez .ready()

$(document).ready(function() {
    // 在文档加载完毕后执行的代码
    alert('文档已加载完毕');
});

Copier après la connexion

(2) Utilisez $ ( )

$(function() {
    // 在文档加载完毕后执行的代码
    alert('文档已加载完毕');
});

Copier après la connexion

(3) Utiliser l'appel direct

jQuery(document).ready(function() {
    // 在文档加载完毕后执行的代码
    alert('文档已加载完毕');
});

Copier après la connexion

3. Exemple de code spécifique

Ce qui suit est un exemple simple qui montre comment utiliser la fonction ready dans jQuery pour modifier le contenu des éléments de la page une fois le document chargé :

<!DOCTYPE html>
<html>
<head>
    <title>jQuery Ready函数示例</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#message').text('文档已加载完毕，jQuery Ready函数执行成功！');
        });
    </script>
</head>
<body>
    <div id="message">这是一个文档加载中的提示</div>
</body>
</html>

Copier après la connexion

Dans l'exemple ci-dessus, lorsque le document est chargé, jQuery modifiera le contenu textuel de l'élément div avec l'identifiant du message dans la page en "Le document a été chargé et la fonction jQuery Ready a été exécutée avec succès !".

4. Conclusion

Grâce à l'exemple ci-dessus, nous pouvons voir le rôle de la fonction ready dans jQuery et comment l'utiliser pour garantir que le code JavaScript correspondant est exécuté après le chargement du document. L'utilisation de la fonction ready peut efficacement éviter les erreurs causées par l'exécution du code lorsque les éléments de la page ne sont pas complètement chargés. C'est un outil très pratique dans le développement Web. J'espère que cet article pourra aider les lecteurs à mieux comprendre l'utilisation et le rôle de la fonction ready dans jQuery.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!