Licznik pozycji na żywo po operacji dodania
Treść zadania
W magazynie mamy akapit <p id="licznikStan">Liczba pozycji: 0</p>, przycisk <button id="btnDodajKarton">Dodaj karton</button> oraz listę <ul id="magazyn"></ul>.
Po kliknięciu przycisku:
1. Utwórz element <li> z tekstem 'Karton towaru' i dołącz go do listy.
2. Zaktualizuj treść akapitu #licznikStan na 'Liczba pozycji: ' + magazyn.children.length.
Co będzie oceniane
- Dołączenie nowego li do #magazyn.
- Odczyt liczby dzieci przez magazyn.children.length.
- Aktualizacja tekstu akapitu #licznikStan na poprawną liczbę pozycji.
- Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.
Testy automatyczne (2)
- Dodanie pierwszego kartonu i aktualizacja licznika na 1 — licznik #magazyn li = 1; tekst #licznikStan = Liczba pozycji: 1
- Dodanie drugiego kartonu i aktualizacja licznika na 2 — licznik #magazyn li = 2; tekst #licznikStan = Liczba pozycji: 2
Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.
// Dodawaj pozycję do listy i aktualizuj licznik w akapicie #licznikStan
Wskazówki
Wskazówka 1
Właściwość children elementu przechowuje kolekcję wszystkich jego znaczników potomnych, a jej długość oddaje ich dokładną liczbę.
Wskazówka 2
Po dołączeniu nowego elementu do listy odczytaj liczbę dzieci za pomocą właściwości długości kolekcji dzieci i wpisz zaktualizowany komunikat do akapitu licznika.