Co lepiej zrobić? .hide()
jest szybsze niż pisanie .css("display", "none")
, ale jaka jest różnica i co oboje faktycznie robią z elementem HTML?
153
Ze strony jQuery na temat .hide () :
„Dopasowane elementy zostaną natychmiast ukryte, bez animacji. Jest to mniej więcej równoważne z wywołaniem .css ('display', 'none'), z wyjątkiem tego, że wartość właściwości display jest zapisywana w pamięci podręcznej danych jQuery, aby można ją było później wyświetlić zostanie przywrócony do swojej wartości początkowej. Jeśli element ma wyświetlaną wartość inline, a następnie jest ukryty i pokazany, zostanie ponownie wyświetlony w tekście. "
Więc jeśli ważne jest, abyś mógł powrócić do poprzedniej wartości display
, lepiej użyj, hide()
ponieważ w ten sposób zapamiętuje się poprzedni stan. Poza tym nie ma różnicy.
.hide()
przechowuje poprzedniądisplay
właściwość tuż przed ustawieniem jej nanone
, więc jeśli nie jest to standardowadisplay
właściwość elementu, który jest nieco bezpieczniejszy,.show()
użyje tej przechowywanej właściwości jako tego, do czego wrócić. Więc ... wykonuje dodatkową pracę, ale jeśli nie robisz mnóstwa elementów, różnica prędkości powinna być pomijalna.źródło
Patrząc na kod jQuery, dzieje się tak:
źródło
To są te same rzeczy.
.hide()
wywołuje funkcję jQuery i umożliwia dodanie do niej funkcji zwrotnej. Tak.hide()
więc możesz na przykład dodać animację..css("display","none")
zmienia atrybut elementu nadisplay:none
. Działa tak samo, jak w przypadku wykonania następujących czynności w JavaScript:Uruchomienie
.hide()
funkcji zajmuje oczywiście więcej czasu, ponieważ sprawdza funkcje wywołania zwrotnego, szybkość itp.źródło
Używanie obu jest miłą odpowiedzią; to nie jest kwestia albo albo.
Zaletą korzystania zarówno to, że CSS natychmiast ukryć elementu po załadowaniu strony. JQuery .hide będzie migać element przez ćwierć sekundy, a następnie go ukryje.
W przypadku, gdy chcemy, aby element nie był pokazywany podczas ładowania strony, możemy użyć CSS i ustawić display: none i użyć jQuery .hide (). Jeśli planujemy przełączać element, możemy użyć przełącznika jQuery.
źródło
Oba robią to samo we wszystkich przeglądarkach, AFAIK. Zaznaczone w przeglądarce Chrome i Firefox, oba dołączają
display:none
dostyle
atrybutu elementu.źródło
Widzisz, nie ma różnicy, jeśli używasz podstawowej metody ukrywania. Ale jquery udostępnia różne metody ukrywania, które nadają elementowi efekty. Zobacz poniższe łącze, aby uzyskać szczegółowe wyjaśnienie: Efekty ukrywania w JQuery
źródło