Différence entre jQuery .hide () et .css ("display", "none")
Y a-t-il une différence entre
jQuery('#id').show() and jQuery('#id').css("display","block")
et
jQuery('#id').hide() and jQuery('#id').css("display","none")
jQuery ('# id'). css ("display", "block")
La propriété display peut avoir plusieurs valeurs possibles, parmi lesquelles block, inline, inline-block et beaucoup plus .
La méthode .show() ne le définit pas nécessairement sur block, mais le réinitialise à ce que vous avez défini (le cas échéant).
Dans le code source de jQuery, vous pouvez voir comment ils définissent la propriété display sur "" (chaîne vide) pour vérifier ce qu'il était avant toute manipulation de jQuery: petit lien .
Par contre, le masquage se fait via display: none;, vous pouvez donc considérer que .hide() et .css("display", "none") sont équivalents à un point.
Il est recommandé d'utiliser .show() et .hide() de toute façon pour éviter les tracas (en plus, ils sont plus courts).
Différence entre show () et css ({'display': 'block'})
En supposant que vous ayez ceci au début:
<span id="thisElement" style="display: none;">Foo</span>
quand vous appelez:
$('#thisElement').show();
tu auras:
<span id="thisElement" style="">Foo</span>
tandis que:
$('#thisElement').css({'display':'block'});
est-ce que:
<span id="thisElement" style="display: block;">Foo</span>
oui, il y a une différence.
Différence entre hide () et css ({'display': 'none'})
comme ci-dessus mais changez-les en hide () et affichez ':' none '......
Autre différence Lorsque .hide() est appelée, la valeur de la propriété display est enregistrée dans le cache de données de jQuery. Ainsi, lorsque .show() est appelé, la valeur d'affichage initiale est restaurée!
Oui, il y a une différence dans les performances des deux: jQuery('#id').show() est plus lent que jQuery('#id').css("display","block") comme dans le cas précédent, un travail supplémentaire doit être effectué pour extraire l'état initial du cache jQuery car l'affichage n'est pas un attribut binaire. il peut s'agir de inline, block, none, table, etc. semblable à la méthode hide().
En l'absence de paramètre, la méthode .hide () est le moyen le plus simple de masquer un élément:
$ ('. target'). hide (); Les éléments correspondants seront immédiatement masqués, sans aucune animation. Cela équivaut à appeler .css ('display', 'none'), sauf que la valeur de la propriété display est enregistrée dans le cache de données de jQuery afin que l'affichage puisse ensuite être restauré à sa valeur initiale. Si un élément a une valeur d'affichage inline, alors est masqué et affiché, il sera à nouveau affiché en ligne.
Pareil pour le spectacle
Oui, il y a une différence.
jQuery('#id').css("display","block") définira toujours l'élément que vous souhaitez afficher en tant que bloc.
jQuery('#id').show() est le type d'affichage initial, display: inline par exemple.
Voir Jquery Doc
Vous pouvez consulter le code source (ici, il s'agit de la version 1.7.2).
À l'exception de l'animation que nous pouvons définir, ceci conserve également en mémoire l'ancien style d'affichage (qui n'est pas dans tous les cas block, il peut également s'agir de inline, table-cell, ... ).
voir http://api.jquery.com/show/
En l'absence de paramètre, la méthode .show () est le moyen le plus simple d'afficher un élément:
$ ('. target'). show ();
Les éléments correspondants seront immédiatement révélés, sans aucune animation. Cela équivaut à peu près à appeler .css ('display', 'block'), sauf que la propriété display est restaurée dans l'état initial. Si un élément a une valeur d'affichage inline, alors est masqué et affiché, il sera à nouveau affiché en ligne.