Diferencia entre jQuery .hide () y .css ("display", "none")

¿Hay alguna diferencia entre

jQuery('#id').show() and jQuery('#id').css("display","block")

y

jQuery('#id').hide() and jQuery('#id').css("display","none")

jQuery ('# id'). css ("mostrar", "bloquear")

La displaypropiedad puede tener muchos valores posibles, entre las que se encuentran block, inline, inline-block, y muchos más .

El .show()método no lo establece necesariamente block, sino que lo restablece a lo que usted definió (si es que lo hace).

En el código fuente de jQuery, puede ver cómo están configurando la displaypropiedad en "" (una cadena vacía) para verificar qué era antes de cualquier manipulación de jQuery: pequeño enlace .

Por otro lado, la ocultación se realiza a través de display: none;, por lo que puede considerar .hide()y .css("display", "none")equivalente a algún punto.

Se recomienda usar .show()y, de .hide()todos modos, evitar cualquier problema (además, son más cortos).

Diferencia entre show () y css ({'display': 'block'})

Suponiendo que tiene esto al principio:

<span id="thisElement" style="display: none;">Foo</span>

cuando usted llama:

$('#thisElement').show();

conseguirás:

<span id="thisElement" style="">Foo</span>

mientras:

$('#thisElement').css({'display':'block'});

hace:

<span id="thisElement" style="display: block;">Foo</span>

entonces, sí, hay una diferencia.

Diferencia entre hide () y css ({'display': 'none'})

igual que arriba pero cámbielos a hide () y muestre ':' none '......

Otra diferencia Cuando .hide()se llama, el valor de la propiedad de visualización se guarda en la caché de datos de jQuery, por lo que cuando .show()se llama, se restaura el valor de visualización inicial.

Sí, hay una diferencia en el rendimiento de ambos: jQuery('#id').show()es más lento de lo jQuery('#id').css("display","block")que en el caso anterior trabajo extra que se debe hacer para recuperar el estado inicial de la memoria caché como jQuery pantalla no es un atributo binario que puede ser inline, block, none, table, etc similares es el caso dehide() método.

Ver: http://jsperf.com/show-vs-addclass

ninguna diferencia

Sin parámetros, el método .hide () es la forma más sencilla de ocultar un elemento:

$ ('. target'). hide (); Los elementos coincidentes se ocultarán inmediatamente, sin animación. Esto es aproximadamente equivalente a llamar a .css ('display', 'none'), excepto que el valor de la propiedad de visualización se guarda en la caché de datos de jQuery para que la visualización se pueda restaurar posteriormente a su valor inicial. Si un elemento tiene un valor de visualización en línea, luego se oculta y se muestra, se volverá a mostrar en línea.

Lo mismo sobre el programa

Sí, hay una diferencia.

jQuery('#id').css("display","block") siempre establecerá el elemento que desea mostrar como bloque.

jQuery('#id').show() will et es el tipo de pantalla que tenía inicialmente, display: inline por ejemplo.

Ver Jquery Doc

Puede echar un vistazo al código fuente (aquí es v1.7.2).

A excepción de la animación que podemos configurar, esto también guarda en memoria el antiguo estilo de visualización (que no es en todos los casos block , también puede ser inline, table-cell, ...).

ver http://api.jquery.com/show/

Sin parámetros, el método .show () es la forma más sencilla de mostrar un elemento:

$ ('. target'). show ();

Los elementos coincidentes se revelarán de inmediato, sin animación. Esto es aproximadamente equivalente a llamar a .css ('display', 'block'), excepto que la propiedad de visualización se restaura a lo que era inicialmente. Si un elemento tiene un valor de visualización en línea, luego se oculta y se muestra, se volverá a mostrar en línea.