GoConqr hat ein neues Design! Sag uns, wie es dir gefällt.

Modul 20 von 21 · Medien

Create a todo list app

Kostas Diakogiannis

Create a todo list app

DOM-8 Create a todo list application

Create an application by using only HTML, CSS and JS, that has an input text field inside a form and a button for submitting. The user should be able to write any task he wants into the input field and see the task as a list item below.

Any time the form is submitted (by either hitting enter on the field, or by clicking the button) a new list item should be created with the text of the content of the input field.

The more tasks you add, the more list items appear.

Take a look at the full result here.

Bonus: Every list item should have a 'delete' button, when clicked it should delete the list item. The 'delete' button should be created inside every list item.

Hint: You may want to check the submit event first, how to access the target of an event, and it's parent element as well. By default every time a form is submitted the information, and all values of the form are sent to the designated target and the page is reloaded. This is the default behavior of a submit event. To change this behavior maybe you want to prevent the default behavior at the first line of your submit event listener.

Anleitung

Um im Kurs weiterzukommen, sende einen Versuch dieses Quiz ab. Du kannst ihn nach der letzten Frage absenden.

Zum gewählten Modul

Feedback

Worum geht es?

Wie gefällt dir das neue Design?

Dein Eindruck