Aufgaben aus den Foliensätzen
- Gestalte eine Seite mit einer Überschrift, drei Absätzen, einem Eingabefeld und einem Button. Füge zunächst einen passenden Text für die Überschrift ein. Danach sollen alle drei Absätze den gleichen Inhalt erhalten. Wenn der Anwender auf den Button drückt, soll der zweite Absatz den Inhalt des Eingabefelds erhalten. Dabei soll es auch möglich sein, HTML-Tags zu verwenden. Nutze für all diese Aufgaben jQuery.
- Gestalte ein farbiges div-Element. Dieses soll auf drei verschiedene Events (mouseout, dblclick und contextmenu) reagieren und dabei jeweils die Art des Events per alert-Befehl ausgeben. Verwende dafür nur eine einzige Methode.
- Gestalte eine Seite mit zwei div-Elementen mit identischer Größe aber unterschiedlichen Farben. Wenn die Seite aufgerufen wird, soll jedoch eines der beiden Elemente mit der hide()-Methode (ohne Verzögerung) versteckt werden. Füge darunter einen Button ein. Wenn der Anwender diesen anklickt, soll das Programm die beiden Rechtecke langsam austauschen, indem es auf beide die toggle()-Methode anwendet.
- Erstelle eine Seite, die beim Laden überprüft, ob Cookies mit dem Namen und der Lieblingsfarbe des Besuchers vorhanden sind. Trifft dies zu, soll sie eine entsprechende Meldung auf der Seite ausgeben. Ist das nicht der Fall, soll das Programm mit zwei prompt-Befehlen die entsprechenden Werte abfragen. Speichere diese daraufhin in zwei Cookies.
- Gestalte eine Seite, die genau die gleiche Funktion wie das Programm oben hat. Verwende jedoch localStorage für die Datenspeicherung
Anmerkung für Übung
Wenn man bei getItem()-Methode einen Bezeichner eingibt, der nicht vorhanden ist, gibt dieser den Wert null zurück – und keine leere Zeichenkette wie bei der Funktion für die Cookies. Daher muss man die Bedingung bei der Überprüfung dementsprechend anpassen.