Maison > Article > interface Web > Jquery est-il une bibliothèque ?
jquery est une bibliothèque. jquery est une excellente bibliothèque de codes JavaScript. Il s'agit d'une bibliothèque de classes développée pour simplifier le développement JS ou DOM et d'autres opérations ; elle encapsule les codes fonctionnels (fonctions) couramment utilisés de JS, fournit un modèle de conception JS simple et optimise le fonctionnement du document HTML. traitement d'événements, conception d'animation, interaction Ajax, etc.
L'environnement d'exploitation de ce tutoriel : système windows7, version jquery3.6.1, ordinateur Dell G3.
jQuery est un framework JavaScript rapide et concis. Il s'agit d'une autre excellente bibliothèque de code JavaScript (framework) après Prototype. Il a été publié par John Resig en janvier 2006. Le but de la conception de jQuery est « écrire moins, faire plus », ce qui signifie écrire moins de code et faire plus de choses. Il encapsule les codes fonctionnels couramment utilisés en JavaScript, fournit un modèle de conception JavaScript simple et optimise les opérations sur les documents HTML, le traitement des événements, la conception d'animations et l'interaction Ajax.
jquery est une bibliothèque de classes encapsulée par JavaScript. Elle fait référence à une bibliothèque de fonctions JavaScript encapsulée, une bibliothèque JavaScript légère qui "écrit moins et fait plus".
jQuery encapsule les codes de fonction JavaScript courants, fournit un modèle de conception JavaScript simple et optimise les opérations sur les documents HTML, le traitement des événements, la conception d'animations et l'interaction Ajax.
Le but de la conception jQuery est « écrire moins, faire plus », ce qui signifie écrire moins de code et faire plus de choses.
Les fonctionnalités principales de jQuery peuvent être résumées comme suit : Il possède une syntaxe de chaîne unique et une interface multifonctionnelle courte et claire ; Il dispose d'un sélecteur CSS efficace et flexible et peut étendre le sélecteur CSS ; -in mécanisme d'extension et plugin riche. jQuery est compatible avec divers navigateurs grand public, tels que IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+, etc.
Fonctionnalités du langage jQuery :
1. Obtenez rapidement des éléments de document
Le mécanisme de sélection de jQuery est construit sur le sélecteur CSS, qui offre la possibilité d'interroger rapidement des éléments dans des documents DOM et améliore considérablement la récupération dans les éléments de page JavaScript. .
2. Fournissez de superbes effets dynamiques de page
jQuery dispose d'une série d'effets d'animation intégrés, qui peuvent développer de très belles pages Web. De nombreux sites Web utilisent les effets intégrés de jQuery, tels que le fondu entrant et sortant, la suppression d'éléments et. d'autres effets spéciaux dynamiques.
3. Créer des pages Web AJAX non actualisées
AJAX est l'abréviation de JavaScript et XML asynchrones. Il peut développer des pages Web non actualisées très sensibles, en particulier lors du développement de pages Web côté serveur, telles que des sites Web PHP, qui en ont besoin. pour communiquer avec le serveur dans les deux sens. Si AJAX n'est pas utilisé, la page Web doit être actualisée à chaque fois que les données sont mises à jour. Cependant, après avoir utilisé les effets spéciaux AJAX, la page peut être partiellement actualisée pour fournir des effets dynamiques.
4. Apporter des améliorations au langage JavaScript
jQuery fournit des améliorations aux structures JavaScript de base, telles que l'itération des éléments et le traitement des tableaux.
5. Gestion améliorée des événements
jQuery fournit divers événements de page, ce qui peut empêcher les programmeurs d'ajouter trop de code de gestion des événements en HTML. Plus important encore, son gestionnaire d'événements élimine le besoin de divers problèmes sexuels de compatibilité avec le navigateur.
6. Modifier le contenu de la page Web
jQuery peut modifier le contenu de la page Web, par exemple en modifiant le texte de la page Web, en insérant ou en retournant des images de page Web. jQuery simplifie la façon dont le code JavaScript doit être traité.
La raison pour laquelle JQuery est si excellent est qu'il intègre de nombreuses excellentes fonctionnalités, notamment les fonctionnalités suivantes :
·Utilisation de sélecteurs CSS pour fournir un comportement de recherche d'éléments à grande vitesse.
· Fournit une couche d'abstraction pour normaliser diverses tâches courantes et peut résoudre les problèmes de compatibilité de divers navigateurs.
·Simplifiez les codes complexes et fournissez un mode de programmation série, ce qui simplifie grandement le fonctionnement des codes.
1 Exécuter après le chargement de la page :
Lorsque nous utilisons habituellement le préchargement, nous devons lier la méthode à onload() :
<script type="text/javascript"> document.onload = function () { // 这个事件在页面加载完成之后加载的 } </script>
Mais dans jQuery, il suffit d'utiliser $() pour charger la méthode
<script type="text/javascript"> $.ready(function () { }); $(function () { //这两个都可以 console.log("页面加载"); }); //在$()中的函数可以自动加载onload函数 </script>
2 Grâce à la chaîne de sélection d'étiquette, renvoyez la ligne d'emballage jQuery de l'objet label
Dans l'objet DOM que nous utilisons :
<script type="text/javascript"> var div = document.getElementsByTagName("div")[0]; </script>.
pour choisir un tag.
Mais en jQuery :
<script type="text/javascript"> var div = $("div"); </script>
p voici un tableau
3. La troisième méthode convertit les objets DOM en objets jQuery
On peut convertir les objets DOM en objets jQuery :
<script type="text/javascript"> var div1 = document.getElementsByTagName("div")[0]; var jqy = $(div1); </script>
Ici nous avons le DOM méthode objet dans jqy.
Code total :
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jQuery</title> <style> <!--选择器 --> div{ /*重定义标签选择器*/ background: #000; } </style> </head> <body> <div>Hello!</div> <script src="js/jquery-3.4.1.slim.min.js"/> <script type="text/javascript"> document.onload = function () { // 这个事件在页面加载完成之后加载的 } $.ready(function () { }); $(function () { //这两个都可以 console.log("页面加载"); });//可以自动加载onload函数 /* * 2.通过标签选择器字符串,返回标签对象的的jQuery包装对线 * */ //在DOM对象中,我们使用 // var div = document.getElementsByTagName("div")[0]; //选择的是div的集合 var div = $("div"); div.css("","");//两个值,前面的是名称,后面是值 /* * 3.第三种方法把DOM对象转换成jQuery对象 * */ var div1 = document.getElementsByTagName("div")[0]; var jqy = $(div1); </script> </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!