Återställning av stilar via style i JavaScript
Låt oss säga att vi av någon anledning bestämmer oss för att dölja ett element:
elem.style.display = 'none';
Låt oss nu säga att vi bestämmer oss för att visa
det igen. Det betyder att
egenskapen display behöver
få tillbaka sitt ursprungliga värde.
Till exempel så här:
elem.style.display = 'block';
Problemet är att det här inte är bekvämt.
För det ursprungliga värdet var inte nödvändigtvis
just block. Det kunde
ha varit flex, eller inline-block,
eller något annat. Det kunde ha satts av oss
i en CSS-fil, eller så kunde det ha hämtats av webbläsaren
som standard. Det är svårt att hålla reda på rätt
värde.
Som tur är finns det ett sätt att enkelt återställa egenskapens ursprungliga värde. Man behöver bara tilldela egenskapen ett tomt strängvärde:
elem.style.display = '';
Given en div och två knappar. Vid klick på den första knappen, dölj div:en, och vid klick på den andra - visa den.
Given en div och två knappar. Vid klick på den första knappen, färga div:ens bakgrund i röd färg, och vid klick på den andra - återställ den ursprungliga färgen.
