Maison >interface Web >Questions et réponses frontales >Quelles sont les quatre méthodes d'événement jquery ready
Quelles sont les quatre méthodes d'événement jquery ready
- 青灯夜游original
- 2022-12-16 17:45:003523parcourir
Les quatre méthodes de l'événement jquery ready sont : 1. Méthode « $(document).ready(function(){……}) » ; 2. « jQuery(document).ready(function(){……}) " Méthode ; 3. Méthode "$(function(){…})" ; 4. Méthode "jQuery(function(){…})".
L'environnement d'exploitation de ce tutoriel : système windows7, version jquery3.6.1, ordinateur Dell G3.
événement jquery ready
L'événement ready se produit lorsque le DOM (modèle objet de document) a terminé le chargement et que la page est entièrement chargée (y compris les images).
Étant donné que cet événement se produit une fois le document prêt, c'est une bonne pratique de placer tous les autres événements et fonctions jQuery dans cet événement.
Dans jQuery, il existe les 4 façons suivantes d'écrire l'événement prêt.
Syntaxe :
//写法1：
$(document).ready(function(){
……
})
//写法2：
jQuery(document).ready(function(){
……
})
//写法3：
$(function(){
……
})
//写法4：
jQuery(function(){
……
})【Analyse du code】
-
Dans la méthode d'écriture 1,
$(document)signifie sélectionner d'abord le document, puis appeler la méthode ready(). Le paramètre de la méthode ready() est une fonction anonyme, comme le montre la figure ci-dessous.$(document)表示先选取 document，然后调用 ready() 方法。其中 ready() 方法的参数是一个匿名函数，如下图 所示。
在写法 2 中，
$就是指jQuery。因此我们可以使用$来代替jQuery，两者是等价的，即$()等价于jQuery()。而写法 3，实际上是我们最常用的也是最简单的，在此之前大家已经接触过很多次了。在实际开发中，我们也建议使用
$(function(){})这种形式，方便简洁。写法 4 是写法 3 的完整形式，在实际开发中，我们并不推荐使用。
$(document).ready()
li>Dans la méthode d'écriture 2, $ fait référence à jQuery. Par conséquent, nous pouvons utiliser $ au lieu de jQuery. Les deux sont équivalents, c'est-à-dire que $() est équivalent à jQuery().
$(function(){}) pour plus de commodité et de simplicité. 
$(document).ready() est la méthode la plus importante dans jQuery, qui peut grandement améliorer la vitesse de chargement de la page. Exemple :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.6.2.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("p").slideToggle();
});
});
</script>
</head>
<body>
<p>这是一个段落 。</p>
<button>切换段落的上滑与下滑。</button>
</body>
</html>🎜🎜🎜🎜[Apprentissage recommandé : 🎜Tutoriel vidéo jQuery🎜, 🎜Vidéo web front-end🎜]🎜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!