localStorage

Schreiben Sie eine html-Seite mit folgenden Elementen:

• Ein Titel
• Ein Eingabefeld um den eigenen Namen einzugeben
• Ein Button «Vergiss mich!»

Die Seite soll sich wie folgt verhalten:

• Beim ersten mal Laden (oder nach dem «Vergiss mich!») soll der Titel «Hallo Unbekannt!» lauten.
• Wenn ein Name eingegeben wurde, soll (auch nach dem Neuladen der Seite) der Titel «Hallo Name» angezeigt werden.
• Die Eingabe eines Names überschreibt den alten Namen
• Der Vergiss-mich Knopf löscht den Namen aus der localStorage.

Machen Sie eine zweite HTMl-Seite, die einfach nur den im localStorage gespeicherten Namen anzeigt und diesen automatisch aktualisiert, wenn auf der ersten Seite der Name geändert wurde.

Siehe auch https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

Schreiben Sie eine Highscore-Verwaltung.

Zum Testen machen Sie zwei Eingabefelder für das Score und den Namen.

Überlegen Sie sich eine geeignete Datenstruktur (Object, Array) für eine Highscore-Liste. Diese kann mit in einen String und zurück verwandelt werden mit:

  let data = {"bla":[1,2,["foo", "bar"]], "blu":"hallo"};
 
  // string aus Object/Array erstellen:
  let zeichenkette = JSON.stringify(data);
 
  // Wieder ein Object/Array aus String erstellen:
  let copy = JSON.parse(zeichenkette);

Stellen Sie die 10 besten Scores in einer Tabelle dar.