Introduction à jQuery
Qu'est-ce que jQuery ?
jQuery = JavaScript + jQuery
jQuery est une bibliothèque JavaScript. Il obtient un ensemble de méthodes définies en encapsulant des fonctions JavaScript natives
jQuery simplifie grandement la programmation JavaScript. Regardez l'exemple ci-dessous
Supposons qu'il y ait les deux éléments suivants dans la page
<input type="text" id="txt" /> <button type="button" onclick="get_text();">Go</button>
Après avoir cliqué sur le bouton Go, le contenu saisi par l'utilisateur dans la zone de texte apparaîtra à l'aide du. code JavaScript original, vous pouvez l'écrire comme ceci
alert(document.getElementById('txt').value);
Lorsque vous utilisez jQuery, vous pouvez simplement l'écrire comme
alert($('#txt').val());
Vous pouvez voir que nous utilisons document.getElementById pour obtenir l'élément avec le spécifié id, et en utilisant jQuery, il suffit d'utiliser $('# ') pour accomplir tout cela
L'objectif principal de jQuery est de réaliser plus de fonctions avec moins de code
La bibliothèque jQuery comprend les fonctions suivantes :
Sélection d'éléments HTML
Opération d'éléments HTML
Opération CSS
-
Fonction d'événement HTML
Effets spéciaux et animation JavaScript
HTML DOM parcours et modification
AJAX
Conseils : De plus, Jquery fournit également un grand nombre de plug-ins.
Conditions d'apprentissage de jQuery
HTML (dont css, la base nécessaire au web pages Connaissance)
JavaScript (même si jQuery est plus simple que JavaScript, les différentes syntaxes de jQuery proviennent de JavaScript)
PHP (jQuery C'est une technologie front-end extrêmement complémentaire et qui fait écho au back-end)
JQuery est-il applicable à tous les navigateurs ?
La communauté jQuery sait que JS a beaucoup de problèmes de compatibilité dans différents navigateurs. Actuellement, jQuery est compatible avec tous les principaux navigateurs, y compris Internet Explorer 6 ! >
Regardons d'abord un exemple jQuery
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js" type="text/javascript"> </script> <script> $(document).ready(function(){ $("p").click(function(){ $(this).hide(); }); }); </script> </head> <body> <p>如果你点我,我就会消失。</p> <p>继续点我!</p> <p>接着点我!</p> </body> </html>
Exécutez le programme et essayez-le