Ezt hogyan? (Javascript)

document.getElementById(alma).style.display = none;

hasonlóan a másikra is.

És ezt beteszed egy js functionbe, amit a gombon onClick eseményre meghívsz.

Némileg elegánsabb, ha a CSS formázás a CSS-en belül marad, és mondjuk osztályokkal operálsz. Lásd:

[link]

Így komplexebb formázásokat is meg lehet valósítani egyetlen lépésben, és ehhez nem kell a javascriptbe belenyúlni, elég csak a CSS-be. Pl.:

[link]

Hát szerintem aki azért kicsit érti a javascriptet és a CSS-t, annak kiderül.

De akkor egy kicsit szájbarágósabb magyarázat. Az egyik megoldás az, ha javascriptből azokat a konkrét változásokat hajtod végre, amit a kinézeten változtatni akarsz. Pl.:

document.getElementById('alma').style.display = none;

Mi a probléma ezzel? Ha nem csak eltüntetni akarunk valamit, hanem mint a második példámnál látható volt, komplexebb formázásokat is végre akarunk hajtani, akkor az javascriptből több sorral oldható meg. Ha több helyen is szükség van rá, akkor vagy kell egy külön függvényt írni, ami ezeket végrehajtja, vagy Copy+Paste mindenhova be kell tolni. Ha változik az igény, nem eltüntetni kell csak az elemet, hanem átlátszóvá tenni, csökkenteni a betűméretet, átszínezni a hátteret, akkor lehet átszervezni az egész kódot. Akkor még komplexebbé válik a kód, ha nem csak az adott elemet kell változtatni, hanem egy komplex DOM struktúrában sok-sok alelemen kell változtatni.

Ennél cizelláltabb megoldás, ha nem a konkrét stílusokat változtatjuk meg az egyes elemeknél, hanem adunk egy osztályt az elemnek, illetve elvesszük azt. Így nem a javascript mondja meg, hogy mi konkrétan az a kinézetbeli változás, aminek az elemmel történnie kell, hanem a CSS. Ha később változtatni kell, egy CSS-hez értő, a javascipthez viszont kevésbé értő ember is bele tud nyúlni az oldalba. Végül is a HTML+CSS+javascript hármasban a HTML-nek kell megmondania azt, hogy mi jelenjen meg, a CSS-nek, hogy mi hogyan nézzen ki, a javascript meg az interakcióért felelős. Az soha nem szerencsés, ha a javascript kezdi megmondani, hogy mi hogyan nézzen ki. Az a CSS feladata. Ha megnézed, a két példámat, az a szép benne, hogy bár a kinézet gyökeresen más – az egyiknél egyszerűen csak eltűnik egy elem, a másiknál viszont fél tucat tulajdonság változik meg – ettől még a javascript része betűről betűre ugyanaz. (Az meg hab a tortán, hogy így még a CSS adta lehetőségekkel animálni is lehet, ami javascriptből azért némileg fájdalmasabb lenne. JQuery-vel még valamennyire egyszerűbb, de pure javascript esetén már fájóbb.)

Igen így van, köszi hogy kifejtetted. Ebbe a hibába kezdőként én is bele estem, így a te megoldásodat alkalmazom már régebb óta.

Én jquery-vel csinálom, nem mintha a js nem menne, de mindenképp hoszabb a kód. Attól, ha valaki jquery-zik, tudnia kell natív javascript nyelven is a kódot. Ha nem indokolt a jquery, akkor írd javascriptben.