Есть ли разница между
jQuery('#id').show() and jQuery('#id').css("display","block")
и
jQuery('#id').hide() and jQuery('#id').css("display","none")
Есть ли разница между
jQuery('#id').show() and jQuery('#id').css("display","block")
и
jQuery('#id').hide() and jQuery('#id').css("display","none")
JQuery ( '# ID'). CSS ( "Дисплей", "блок" )
Свойство display
может иметь множество возможных значений, среди которых block
, inline
, inline-block
и еще много.
Метод .show()
не устанавливает его обязательно в block
, а скорее сбрасывает его на то, что вы его определили (если вообще).
В исходном коде jQuery вы можете увидеть, как они устанавливают свойство display
в значение "(пустая строка), чтобы проверить, что это было перед любыми манипуляциями jQuery: маленькая ссылка.
С другой стороны, скрытие выполняется через display: none;
, поэтому вы можете считать .hide()
и .css("display", "none")
эквивалентными некоторой точке.
В любом случае рекомендуется использовать .show()
и .hide()
во избежание получения (плюс, они короче).
Разница между show() и css ({'display': 'block'})
Предполагая, что у вас это в начале:
<span id="thisElement" style="display: none;">Foo</span>
когда вы вызываете:
$('#thisElement').show();
вы получите:
<span id="thisElement" style="">Foo</span>
а
$('#thisElement').css({'display':'block'});
делает:
<span id="thisElement" style="display: block;">Foo</span>
, да, есть разница.
Разница между hide() и css ({'display': 'none'})
как указано выше, но измените их на hide() и покажите ':' none '......
Другое отличие
Когда вызывается .hide()
, значение свойства отображения сохраняется в кеше данных jQuery, поэтому, когда вызывается .show()
, восстанавливается начальное значение отображения!
Да, есть разница в производительности обоих:
jQuery('#id').show()
медленнее, чем jQuery('#id').css("display","block")
, как в предыдущем случае необходимо выполнить дополнительную работу для извлечения исходного состояния из кеша jquery, поскольку отображение не является двоичным атрибутом, оно может быть inline
, block
, none
, table
и т.д.
аналогично случаю с методом hide()
.
Смотрите: http://jsperf.com/show-vs-addclass
Без параметров метод .hide() - это самый простой способ скрыть Элемент:
.$( 'цель') скрыть(); Соответствующие элементы будут немедленно скрыты без анимации. Это примерно эквивалентно вызову .css('display', 'none'), за исключением того, что значение свойства отображения сохраняется в кеш данных jQuery, чтобы впоследствии можно было отобразить Начальное значение. Если элемент имеет отображаемое значение inline, тогда скрытый и показанный, он снова будет отображаться в строке.
То же самое о шоу
Да, есть разница.
jQuery('#id').css("display","block")
всегда будет указывать элемент, который вы хотите показать как блок.
jQuery('#id').show()
будет et, к какому типу отображения, который он изначально был, отображать: например, в строке.
См. JQuery Doc
Вы можете посмотреть исходный код (здесь это v1.7.2).
За исключением анимации, которую мы можем установить, это также сохраняет в памяти старый стиль отображения (который не во всех случаях block
, он также может быть inline
, table-cell
,...).
см. http://api.jquery.com/show/
Без параметров метод .show() - это самый простой способ отображения элемента:
$( 'мишени.') Шоу();.
Соответствующие элементы будут немедленно обнаружены без анимации. Это примерно эквивалентно вызову .css('display', 'block'), за исключением того, что свойство отображения восстанавливается до того, что было изначально. Если элемент имеет отображаемое значение inline, он скрыт и отображается, он снова будет отображаться в строке.