Afficher masquer jquery

Avec le développement d'Internet, les technologies de développement front-end se diversifient de plus en plus. Parmi elles, jQuery est l’une des technologies de développement front-end les plus connues. Il peut être utilisé pour mettre en œuvre de nombreuses fonctions, telles que la validation de formulaires, la modification dynamique du contenu d'une page, des effets d'animation, etc. Dans cet article, je vais vous présenter une fonction très importante de jQuery : l'affichage et le masquage d'éléments.

Les méthodes show et hide dans jQuery

Dans jQuery, les éléments sont affichés et masqués respectivement via les méthodes show et hide. Ces deux méthodes sont très simples à utiliser et ne nécessitent qu’une simple instruction. Voici un exemple :

$( "#element" ).show(); // 显示元素
$( "#element" ).hide(); // 隐藏元素

Dans l'exemple ci-dessus, nous transmettons l'ID de l'élément au sélecteur jQuery, puis utilisons respectivement les méthodes show et hide pour contrôler l'affichage et le masquage de l'élément.

De plus, les méthodes show et hide peuvent également accepter un paramètre facultatif pour contrôler le temps d'animation. Par défaut, jQuery n'utilise pas d'effets d'animation lors du contrôle de l'affichage et du masquage des éléments. Cependant, si vous souhaitez que l'affichage et le masquage d'éléments aient un effet d'animation, vous pouvez y parvenir en définissant la durée de l'animation. Voici un exemple :

$( "#element" ).show( "slow" ); // 显示元素，并带有动画效果
$( "#element" ).hide( "fast" ); // 隐藏元素，并带有动画效果

Dans l'exemple ci-dessus, nous avons passé le temps de l'effet d'animation comme paramètre aux méthodes show et hide. Dans cet exemple, nous utilisons les deux chaînes « lente » et « rapide » comme paramètres temporels. Ces chaînes représentent différentes vitesses d'animation. Par défaut, "lent" représente 600 millisecondes et "rapide" représente 200 millisecondes.

Utilisez la méthode toggle pour changer l'affichage et le masquage des éléments

En plus des méthodes show et hide, jQuery fournit également une méthode très utile - la méthode toggle. Cette méthode bascule entre afficher et masquer l’élément. Voici un exemple :

$( "#element" ).toggle(); // 切换元素的显示状态

Dans l'exemple ci-dessus, nous avons appelé la méthode toggle pour changer l'état d'affichage de l'élément. Si l'élément est actuellement masqué, l'élément sera affiché après avoir appelé la méthode toggle. En revanche, si l'élément est actuellement affiché, l'élément sera masqué après l'appel de la méthode toggle.

De plus, la méthode toggle peut également accepter un paramètre facultatif et être utilisée pour contrôler l'effet de l'animation. Comme pour les méthodes show et hide, vous pouvez définir la durée de l'animation pour afficher et masquer les éléments avec certains effets d'animation. Voici un exemple :

$( "#element" ).toggle( "slow" ); // 切换元素的显示状态，并带有动画效果

Résumé

Dans cet article, nous avons présenté les méthodes utilisées pour contrôler l'affichage et le masquage des éléments dans jQuery : afficher, masquer, basculer. Ces méthodes sont très simples à utiliser, il suffit de transmettre l’ID de l’élément. De plus, ces méthodes peuvent accepter un paramètre facultatif pour contrôler l’effet d’animation. Si vous souhaitez animer l'affichage et le masquage d'éléments, vous pouvez le faire en définissant la durée de l'animation.

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!