local storage API Asynchrone Verarbeitung Zu beachtende Punkte

Asynchrone Local Storage API JavaScript: Zu beachtende Punkte

Erklärung der zu beachtenden Punkte bei asynchroner Verarbeitung mit der Local Storage API.

Shou Arisaka
1 Min. Lesezeit
6. Nov. 2025

Woran ich etwa eine Stunde hängen blieb, war, als ich einen Wert in einem input-Tag oder so umschreiben und ihn in einem Local Storage-Schlüssel speichern wollte.

<input id="result" type="text" name="main" value='gege'>
<input type="button" name="button" value="SAVE" onclick="save()"/>

<script type="text/javascript">

function save(){
localStorage.setItem("content", document.getElementById("result").getAttribute('value'));
}

</script>

Bereiten Sie zunächst HTML wie dieses vor.

Es ist einfacher zu verstehen mit Chrome Developer Tools. Es ist application > storage > local storage.

Wenn Sie dann dieses HTML anzeigen, bestätigen Sie, dass kein Wert im Local Storage in den Entwicklertools vorhanden ist, und drücken Sie die SAVE-Schaltfläche.

Dann wurde, glaube ich, gege zum Wert hinzugefügt.

Schreiben Sie jetzt den input-Wert auf etwas wie hoge um und drücken Sie die Schaltfläche erneut. Es sollte sich ändern, oder?

...Aber es ändert sich nicht.

So bin ich hängen geblieben. Hmm, ich frage mich warum.

Für solche asynchronen Verarbeitungen denke ich, es ist besser, eine Bibliothek wie AngularJS anstelle von einfachem JavaScript + HTML zu verwenden.

Diesen Artikel teilen

Shou Arisaka 6. Nov. 2025

🔗 Links kopieren