querySelector

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

Funkcja querySelector() wybiera pierwszy element pasujący do zaawansowanego selektora podobnego do CSS, zapewniając większą elastyczność niż poprzednie metody wyboru złożonych elementów. Przykład:

const button = document.querySelector("#btn");

W ten sposób uzyskujemy dostęp do elementu button o identyfikatorze btn.

Wyzwanie

Łatwy

Otrzymujesz kod HTML zawierający przycisk.

Używając wyłącznie JavaScript,

Pobierz element za pomocą funkcji querySelector.
Zmień backgroundColor na czerwony za pomocą właściwości style.
Zmień color na biały za pomocą właściwości style.

Spróbuj swoich sił

<!DOCTYPE html>
<html>
    <body>
        <button id="myButton">Click Me</button>
        <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 getElementsByClassName Iterowanie i manipulowanie getElementsByTagNamequerySelector

3Metody DOM II

querySelectorAll addEventListener innerHTML createElement i appendChild Przełączanie classList

Poćwicz samodzielnie: Edytor online Web