Challenge: Add and Remove DOM Elements
Task
You're building a shopping cart where users can add and remove items.
- Add an Item to the Cart:
- Create a new
<li>
element; - Create a new
<button>
element; - Add new
<button>
element to the new<li>
element; - Add a new
<li>
element to the<ul>
with thecart-list
ID.
- Create a new
- Remove an Item from the Cart: Delete the specific
<li>
element from the<ul>
.
index.html
index.css
index.js
- Use
createElement
to create a new<li>
element; - Use
createElement
to create a new<button>
element; - Use
appendChild
to add new<button>
element to the<li>
element; - Use
appendChild
to add a new<li>
element to the<ul>
with the IDcart-list
; - Use
removeChild
to delete the specific<li>
element from the<ul>
.
index.html
index.css
index.js
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 2. Luku 11
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Suggested prompts:
Kysy minulta kysymyksiä tästä aiheesta
Tiivistä tämä luku
Näytä käytännön esimerkkejä
Awesome!
Completion rate improved to 2.22
Challenge: Add and Remove DOM Elements
Pyyhkäise näyttääksesi valikon
Task
You're building a shopping cart where users can add and remove items.
- Add an Item to the Cart:
- Create a new
<li>
element; - Create a new
<button>
element; - Add new
<button>
element to the new<li>
element; - Add a new
<li>
element to the<ul>
with thecart-list
ID.
- Create a new
- Remove an Item from the Cart: Delete the specific
<li>
element from the<ul>
.
index.html
index.css
index.js
- Use
createElement
to create a new<li>
element; - Use
createElement
to create a new<button>
element; - Use
appendChild
to add new<button>
element to the<li>
element; - Use
appendChild
to add a new<li>
element to the<ul>
with the IDcart-list
; - Use
removeChild
to delete the specific<li>
element from the<ul>
.
index.html
index.css
index.js
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 2. Luku 11