Introduction: JavaScript30 is a 30-day challenge launched by Wes Bos. The project pur purpose is to make the web page simulate the effect of the menu, add new dishes to the page, and it will not be cleared after the page is refreshed.
In the current initial page, when the submit button (Add Item) is clicked, the page triggers the submit event by default, and the page is reloaded. This causes the newly submitted content to be lost in the reloaded page. The CSS file used in the page has been completed, what we need to do is to complete the content of the JavaScript part to achieve the target effect.
This challenge may take a little longer than the previous one, but after understanding the mechanism of localStorage and wanting to understand the implementation of the menu.
The live demo is on GitHub
-Event -event.preventDefault -eventTarget.addEventListener
-`localStorage.setItem()`
-`localStorage.getItem()`
-JSON
-`JSON.stringify()`
-`JSON.parse()`