Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Вивчайте Завдання: Додавання та Видалення Елементів DOM | Маніпулювання DOM для Інтерактивної Веб-Розробки
Просунуте Володіння JavaScript

bookЗавдання: Додавання та Видалення Елементів DOM

Завдання

Ви створюєте кошик для покупок, у якому користувачі можуть додавати та видаляти товари.

  1. Додати товар до кошика:
    • Створити новий елемент <li>;
    • Створити новий елемент <button>;
    • Додати новий елемент <button> до нового елемента <li>;
    • Додати новий елемент <li> до <ul> з ID cart-list.
  2. Видалити товар з кошика: Видалити відповідний елемент <li> з <ul>.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Використовуйте createElement для створення нового елемента <li>;
  • Використовуйте createElement для створення нового елемента <button>;
  • Використовуйте appendChild для додавання нового елемента <button> до елемента <li>;
  • Використовуйте appendChild для додавання нового елемента <li> до <ul> з ID cart-list;
  • Використовуйте removeChild для видалення відповідного елемента <li> з <ul>.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 11

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Awesome!

Completion rate improved to 2.22

bookЗавдання: Додавання та Видалення Елементів DOM

Свайпніть щоб показати меню

Завдання

Ви створюєте кошик для покупок, у якому користувачі можуть додавати та видаляти товари.

  1. Додати товар до кошика:
    • Створити новий елемент <li>;
    • Створити новий елемент <button>;
    • Додати новий елемент <button> до нового елемента <li>;
    • Додати новий елемент <li> до <ul> з ID cart-list.
  2. Видалити товар з кошика: Видалити відповідний елемент <li> з <ul>.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Використовуйте createElement для створення нового елемента <li>;
  • Використовуйте createElement для створення нового елемента <button>;
  • Використовуйте appendChild для додавання нового елемента <button> до елемента <li>;
  • Використовуйте appendChild для додавання нового елемента <li> до <ul> з ID cart-list;
  • Використовуйте removeChild для видалення відповідного елемента <li> з <ul>.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 2. Розділ 11
some-alt