Resetowanie stylów za pomocą style w JavaScript
Załóżmy, że w wyniku jakiegoś zdarzenia postanowiliśmy ukryć element:
elem.style.display = 'none';
Załóżmy teraz, że postanowiliśmy pokazać
go z powrotem. Oznacza to, że
właściwości display trzeba
przywrócić jej pierwotną wartość.
Na przykład tak:
elem.style.display = 'block';
Problem w tym, że jest to niewygodne.
Przecież pierwotna wartość niekoniecznie
była właśnie block. Mogła
być flex, inline-block,
czy czymś jeszcze innym. Mogła być przez nas ustawiona
w pliku CSS, a mogła być domyślnie brana przez przeglądarkę.
Śledzenie prawidłowej wartości jest trudne.
Na szczęście istnieje sposób, aby łatwo przywrócić pierwotną wartość właściwości. Wystarczy przypisać jej pusty ciąg znaków jako wartość:
elem.style.display = '';
Dany jest div i dwa przyciski. Po kliknięciu na pierwszy przycisk ukryj div, a po kliknięciu na drugi - pokaż.
Dany jest div i dwa przyciski. Po kliknięciu na pierwszy przycisk pokoloruj kolor diva na czerwono, a po kliknięciu na drugi - przywróć pierwotny kolor.