Iterowanie i manipulowanie

Lekcja 6 z 13 w kursie Metody DOM w JavaScript w Coddy.

Rzućmy sobie wyzwanie!

Wyzwanie

Łatwy

Otrzymujesz kod HTML zawierający pięć akapitów z nazwą klasy item.

Używając wyłącznie JavaScript, zmodyfikuj tekst akapitów tak, aby przypominały numerowaną listę.

Oto oczekiwany wynik:

Nie zapomnij odświeżyć strony internetowej, aby zobaczyć zmiany wprowadzone przez JS!

Spróbuj swoich sił

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <p class="item">Banana</p>
        <p class="item">Apple</p>
        <p class="item">Pear</p>
        <p class="item">Water</p>
        <p class="item">Milk</p>
        <script src="script.js"></script>
    </body>
</html>

Wszystkie lekcje w sekcji Metody DOM w JavaScript

1Wprowadzenie

Wprowadzenie Model obiektowy dokumentu

2Metody DOM I

getElementById Modyfikowanie stylu elementu getElementsByClassNameIterowanie i manipulowaniegetElementsByTagName querySelector

3Metody DOM II

querySelectorAll addEventListener innerHTML createElement i appendChild Przełączanie classList

Poćwicz samodzielnie: Edytor online Web