Maison > interface Web > Questions et réponses frontales > Parlons de plusieurs utilisations du symbole jQuery $

Parlons de plusieurs utilisations du symbole jQuery $

PHPz
Libérer: 2023-04-05 14:21:00
original
1746 Les gens l'ont consulté

jQuery est une bibliothèque JavaScript très populaire qui simplifie la programmation JavaScript et simplifie la traversée et la manipulation de documents HTML, la gestion des événements, l'animation et les opérations Ajax. Le symbole

jQuery$ est l'une de ses fonctions les plus couramment utilisées. Il a de nombreuses utilisations, et cet article en présentera quelques-unes. Le symbole

  1. Selector

jQuery$ peut être utilisé comme sélecteur pour sélectionner des éléments. Vous pouvez transmettre le symbole $ à un sélecteur CSS et il renverra des objets jQuery pour tous les éléments correspondant à ce sélecteur. Par exemple, $("div") renverra des objets jQuery pour tous les div de la page. Si vous souhaitez sélectionner un élément spécifique, vous pouvez utiliser des sélecteurs CSS en combinaison avec d'autres sélecteurs, tels que l'identifiant ou le nom de classe.

Exemple :

//选择class为example的元素
$(".example")

//选择id为foo的元素
$("#foo")

//选择带有名为"data_role"属性的所有元素
$("[data-role]")

//选择第一个p元素
$("p:first")
Copier après la connexion
  1. Gestion des événements

La gestion des événements via la fonction jQuery$ est très simple. Les gestionnaires d'événements peuvent être enregistrés à l'aide de la fonction on(). Par exemple, le code suivant fera qu'un événement de clic sur un bouton modifiera le texte du bouton :

//选中按钮元素
var button = $("button");

//注册点击事件处理函数
button.on("click", function() {
  button.text("Clicked!");
});
Copier après la connexion
  1. Manipulation d'éléments

Manipuler des éléments via la fonction jQuery$ est également très pratique. Par exemple, vous pouvez utiliser la fonction text() pour obtenir ou définir le contenu textuel d'un élément :

//获取id为foo的元素文本内容
console.log($("#foo").text());

//将id为foo的元素文本内容设置为“Hello World!”
$("#foo").text("Hello World!");
Copier après la connexion

Vous pouvez également utiliser la fonction append() pour ajouter des éléments au document.

//创建一个新的div元素
var newDiv = $("<div></div>");

//将新元素添加到body中
$("body").append(newDiv);
Copier après la connexion
  1. Effets d'animation

jQuery peut également utiliser des effets d'animation pour modifier les propriétés des éléments. Par exemple, vous pouvez utiliser la fonction animate() pour modifier la position, la taille, la couleur et d'autres attributs d'un élément.

//通过动画移动元素
$("#foo").animate({left: '+=10px'}, 'slow');
Copier après la connexion

Ce code déplacera l'élément de 10 pixels vers la droite, en utilisant la vitesse "lente".

Résumé

Ci-dessus sont plusieurs utilisations de la fonction jQuery$. jQuery rend la programmation JavaScript très simple grâce aux sélecteurs, à la gestion des événements, à la manipulation des éléments et aux effets d'animation. Si vous n'avez jamais utilisé jQuery auparavant, je vous recommande fortement de l'essayer.

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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal