Maison >interface Web >js tutoriel >Explication détaillée de la différence entre l'écriture de code jquery et l'écriture js native

Explication détaillée de la différence entre l'écriture de code jquery et l'écriture js native

伊谢尔伦
伊谢尔伦original
2017-06-19 11:19:391684parcourir

Pour utiliser jQuery, vous devez d'abord ajouter une référence à la bibliothèque jQuery au début du code HTML, par exemple :

<script language="javascript" src="/js/jquery.min.js"></script>

Le fichier de la bibliothèque peut être placé localement, ou vous pouvez directement utiliser le CDN d'une entreprise bien connue. L'avantage est que les CDN de ces grandes entreprises sont relativement populaires avant que les utilisateurs ne visitent votre site Web, ils l'ont probablement mis en cache dans le navigateur lorsqu'ils visitent d'autres sites Web, ce qui peut accélérer le processus. ouverture du site Internet. Un autre avantage est évident : économiser la bande passante du trafic du site Web.

La différence entre l'écriture de code jquery et l'écriture js native est la suivante :

1. Positionnement des éléments
JS
document.getElementById("abc" )

jQuery
$("#abc") Positionné par identifiant
$(".abc") Positionné par classe
$("div") Positionné par tag

Il est à noter que le résultat renvoyé par JS est cet élément, et le résultat renvoyé par jQuery est un objet JS. L'exemple suivant suppose que l'élément abc a été positionné.

2. Changer le contenu de l'élément
JS
abc.innerHTML = "test";
jQuery
abc.html("test");

3 . Afficher les éléments cachés
JS
abc.style.display = "none"
abc.style.display = "block";

jQuery
abc.hide();
abc.show();

abc.toggle();
//Basculer entre l'affichage et le masquage

4. 🎜>

JS et jQuery sont identiques, tous deux abc.focus();

5. Attribuez des valeurs au formulaire

JS
abc.value = "test" jQuery
abc.val("test");

6. Récupère la valeur du formulaire

JS

alert(abc.value);
jQuery
alert(abc.val ());

7. Définissez l'élément pour qu'il soit indisponible

JS

abc.disabled = true
jQuery
abc.attr("disabled" , true);

8. Modifier le style de l'élément

JS

abc.style.fontSize=size;
jQuery
abc.css('
font-size
', 20);JS

abc.className="test";

JQuery
abc.removeClass();
abc.addClass("test");

9. Ajax

JS

Créez des objets par vous-même

, gérez vous-même la compatibilité du navigateur et d'autres problèmes compliqués, omettez-les jQuery

$.get("abc.php?a=1&b=2", recall);
postvalue = "a=b&c=d&abc=123";
$.post("abc.php", postvalue, recall);
10. Déterminez si la case
function recall(result) {
alert(result);
//如果返回的是json,则如下处理
//result = eval(&#39;(&#39; + result + &#39;)&#39;); 
//alert(result);
}

est cochée jQueryif(abc.attr("checked") == "checked")

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn