getElementById

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

Funkcja getElementById() pobiera pierwszy element z pasującym atrybutem id, na przykład:

const element = document.getElementById("elementId");

Powyższy kod pobiera element o identyfikatorze elementId i zapisuje go w zmiennej o nazwie element.

Zwróć uwagę na prefiks document — to DOM pliku HTML.

Po pobraniu elementu możesz manipulować nim za pomocą JavaScript!

Pierwszą właściwością, której się nauczymy, jest textContent, która przechowuje tekst elementu. Możesz zmienić tekst w ten sposób:

const element = document.getElementById("elementId");
element.textContent = "some text";

Po wykonaniu tego kodu tekst elementu #elementId będzie mieć wartość some text

Wyzwanie

Łatwy

Masz kod HTML zawierający nagłówek z identyfikatorem.

Używając wyłącznie JavaScript, zmień tekst tego elementu na “Hello!”:

Spróbuj swoich sił

<!DOCTYPE html>
<html>
    <body>
        <h1 id="heading">Welcome!</h1>
        <script src="script.js"></script>
    </body>
</html>

Wszystkie lekcje w sekcji Metody DOM w JavaScript

1Wprowadzenie

2Metody DOM I

3Metody DOM II

Poćwicz samodzielnie: Edytor online Web