Maison >interface Web >js tutoriel >jQuery Store Data dans un div
Données de stockage dans un div pour référence ultérieure à l'aide de l'extrait jQuery. Les données ne sont pas affichées dans le div, mais sont stockées dans l'élément. Notez que si la collection jQuery fait référence à plusieurs éléments, la valeur retournée fait référence au premier élément. Ce qui suit est la méthode de fonctionnement:
// 设置要存储的值 $("div").data("valuename", "hello"); // 获取存储的值 var value = $("div").data("valuename"); // 输出 "hello" alert(value); // 您也可以更改值 $("div").data("valuename", 101); // 获取新的存储值 var value = $("div").data("valuename"); // 输出 "101" alert(value);
Vous pouvez utiliser removeData(valuename)
pour supprimer les éléments de données stockés dans le div.
Créer des éléments div à l'aide de jQuery est très simple. Vous pouvez utiliser la fonction jQuery $('<div></div>')
pour créer un nouvel élément div. Cette fonction crée un nouvel objet jQuery avec le contenu HTML spécifié. Vous pouvez ensuite utiliser la fonction append()
pour ajouter ce nouvel élément div au corps du document HTML, par exemple: $ ('corps'). Ajouter ($ ('<div> </div>'));
.
Vous pouvez ajouter du contenu à l'élément div à l'aide de la fonction html () <code>html()
ou text () <code>text()
dans jQuery. La fonction html () <code>html()
vous permet d'ajouter du contenu HTML, tandis que la fonction text () <code>text()
vous permet d'ajouter du contenu texte. Par exemple, si vous avez un élément DIV avec ID "MyDiv", vous pouvez y ajouter du contenu comme ceci: $ ('# myDiv'). Html ('Ceci est un contenu'); <code>$('#myDiv').html('这是一个内容');
.
jQuery fournit la fonction data () <code>data()
pour stocker et récupérer les données associées aux éléments DOM. Vous pouvez stocker des données dans l'élément div comme ceci: $ ('# mydiv'). Data ('key', 'value'); <code>$('#myDiv').data('key', 'value');
. Vous pouvez ensuite récupérer ces données à l'aide de la même fonction data () <code>data()
, par exemple: $ ('# myDiv'). Data ('key'); <code>$('#myDiv').data('key');
.
Vous pouvez utiliser la fonction supprimer () <code>remove()
dans jQuery pour supprimer l'élément div. Cette fonction supprime l'élément sélectionné et ses enfants. Par exemple, si vous avez un élément DIV avec ID "MyDiv", vous pouvez le supprimer comme ceci: $ ('# myDiv'). Supprime (); <code>$('#myDiv').remove();
.
jQuery fournit masquer () <code>hide()
et show () <code>show()
fonctions pour masquer et afficher les éléments. Vous pouvez masquer l'élément div comme ceci: $ ('# mydiv'). Hide (); <code>$('#myDiv').hide();
. Vous pouvez ensuite afficher cet élément div comme ceci: $ ('# mydiv'). Show (); <code>$('#myDiv').show();
.
Vous pouvez modifier le CSS d'un élément DIV en utilisant la fonction css () <code>css()
dans jQuery. Cette fonction vous permet de définir une ou plusieurs propriétés CSS pour l'élément sélectionné. Par exemple, si vous avez un élément DIV avec ID "MyDiv", vous pouvez modifier sa couleur d'arrière-plan comme ceci: $ ('# myDiv'). CSS ('Background-Color', 'Red'); <code>$('#myDiv').css('background-color', 'red');
.
jQuery fournit la fonction animate () <code>animate()
pour créer des animations personnalisées. Vous pouvez animer l'élément div comme ceci: $ ('# myDiv'). Animate ({Left: '250px'}); <code>$('#myDiv').animate({left: '250px'});
. Cela déplacera l'élément div 250 pixels vers la droite.
Vous pouvez ajouter des classes aux éléments Div à l'aide de la fonction addClass () <code>addClass()
dans jQuery. Cette fonction ajoute la classe spécifiée à chaque élément de l'ensemble d'élément correspondant. Par exemple, si vous avez un élément div avec ID "MyDiv", vous pouvez y ajouter la classe comme ceci: $ ('# mydiv'). AddClass ('myClass'); <code>$('#myDiv').addClass('myClass');
.
jQuery fournit les fonctions width () <code>width()
et height () <code>height()
pour obtenir la largeur et la hauteur calculées actuelles de l'élément. Vous pouvez obtenir la largeur et la hauteur de l'élément div comme ceci: $ ('# mydiv'). Width (); <code>$('#myDiv').width();
et $ ('# mydiv'). Hight (); <code>$('#myDiv').height();
.
jQuery fournit plusieurs fonctions pour lier des événements à des éléments, tels que click()
, dblclick()
, mouseenter()
, mouseleave()
, $('#myDiv').click(function() { alert('Div was clicked!'); });
, etc. Vous pouvez lier des événements à des éléments de division comme ceci:
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!