Créer une liste d'applications est un projet commun pour apprendre JavaScript. Il aide à comprendre comment manipuler le DOM, gérer les événements et stocker les données localement. L'utilisation du stockage local permet à l'application de se souvenir des tâches même après la fermeture du navigateur.

Configuration de la structure HTML

L'application nécessite une mise en page HTML simple avec entrée pour de nouvelles tâches, un bouton pour ajouter des tâches, et une liste pour les afficher. Cette structure fournit la base pour les interactions dynamiques.

Exemple de structure :

<div id="app">

Type <input="text" id="taskInput" placeholder="Entrer une nouvelle tâche">

<bouton id="addButton">Ajouter Tâche</bouton>

La Commission a décidé de ne pas modifier le règlement (CE) n° 798/2001.

etlt;/div>

Mise en œuvre de la fonctionnalité JavaScript

JavaScript gère l'ajout, la suppression et le stockage des tâches. Il charge les tâches du stockage local sur la charge de page et met à jour l'affichage en conséquence.

Les fonctions clés sont les suivantes :

  • addTask(): Ajoute une nouvelle tâche à la liste et la sauvegarde.
  • deleteTask(): Supprime une tâche de la liste et met à jour le stockage.
  • loadTasks(): Charge les tâches de stockage local lorsque la page est chargée.

Les auditeurs d'événements sont attachés pour gérer les clics de bouton et les suppressions de tâches.

Utilisation du stockage local

Le stockage local stocke les tâches comme une chaîne JSON. Lorsque l'application charge, elle récupère et analyse ces données pour afficher les tâches existantes. Chaque ajout ou suppression met à jour les données stockées.

Cette approche assure la persistance des données sans stockage côté serveur, rendant l'application simple et efficace à des fins d'apprentissage.