Wstawianie elementu na początku listy (prepend)
Treść zadania
W dokumencie przygotowano listę z zadaniami <ul id="listaWazna"><li>Zadanie standardowe</li></ul>, pole tekstowe <input type="text" id="wpisPilny" value="Pilny alert!"> oraz przycisk <button id="btnDodajPilne">Dodaj na początek</button>.
Po kliknięciu przycisku utwórz <li> z wartością z pola i wstaw go na sam początek listy za pomocą metody #listaWazna.prepend(li).
Co będzie oceniane
- Pobranie elementów #wpisPilny, #btnDodajPilne i #listaWazna.
- Użycie metody prepend do wstawienia na początek listy.
- Prawidłowe pojawienie się nowego elementu jako first-child.
- Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.
Testy automatyczne (1)
- Wstawienie elementu na początek listy — licznik #listaWazna li = 2; tekst #listaWazna li:first-child = Pilny alert!
Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.
// Wstaw nowy element li na początek listy #listaWazna za pomocą metody prepend
Wskazówki
Wskazówka 1
Metoda prepend wstawia podany element jako pierwsze dziecko kontenera, przesuwając istniejące elementy w dół.
Wskazówka 2
Utwórz nowy węzeł listy, ustaw jego tekst z wartości pola edycyjnego i przekaż go jako parametr do metody wstawiania na początek wywołanej na obiekcie listy.