Pomiń nawigację
Ćwiczenie · Informatyka Ćwiczenie: Sumowanie zaznaczonych opcji pętlą forEach

Sumowanie zaznaczonych opcji pętlą forEach

Treść zadania

W formularzu znajduje się grupa checkboxów z klasą usluga:

<input type="checkbox" class="usluga" value="50" checked> Wymiana oleju (50 zł)
<input type="checkbox" class="usluga" value="80" checked> Wymiana klocków (80 zł)
<input type="checkbox" class="usluga" value="120"> Diagnostyka (120 zł)

oraz przycisk <button id="btnSumaUslug">Zsumuj usługi</button> i akapit <p id="lacznieUslugi"></p>. Pobierz wszystkie zaznaczone pola za pomocą document.querySelectorAll('.usluga:checked'), zsumuj ich wartości w pętli forEach i wpisz do akapitu: Koszt usług: 130.00 zł.

Co będzie oceniane

  • Pobranie kolekcji z użyciem querySelectorAll('.usluga:checked').
  • Sumowanie wartości w pętli forEach.
  • Wpisanie Koszt usług: 130.00 zł do akapitu.
  • Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.

Testy automatyczne (1)

  1. Zsumowanie dwóch zaznaczonych usług (50 + 80 = 130 zł) — tekst #lacznieUslugi = Koszt usług: 130.00 zł

Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.

// Pobierz zaznaczone checkboxy i zsumuj w pętli forEach

Wskazówki

Wskazówka 1

Metoda querySelectorAll() z selektorem .usluga:checked zwraca kolekcję zaznaczonych elementów.

Wskazówka 2

Zadeklaruj zmienną let suma = 0;, przejdź po kolekcji pętlą forEach(function(pole) { suma += parseInt(pole.value, 10); }) i wyświetl wynik z toFixed(2).