DOM HTML pozwala JavaScript, żeby zmienić styl elementów HTML.
Zmiana stylu HTML
Aby zmienić styl elementu HTML, należy użyć następującej składni:
document.getElementById(id).style.property=new style
Poniższy przykład zmienia stylu <p> element:
Przykład
<html>
<body>
<p id="p2">Hello World!</p>
<script>
document.getElementById("p2").style.color = "blue";
</script>
<p>The paragraph above was changed by a script.</p>
</body>
</html>
Spróbuj sam " Korzystanie Events
DOM HTML pozwala na wykonanie kodu w przypadku wystąpienia zdarzenia.
Zdarzenia są generowane przez przeglądarkę, gdy "się zdarzyć rzeczy" do elementów HTML:
- Element jest kliknął
- Załadowaniu strony
- Pola wprowadzania są zmieniane
Dowiesz się więcej o wydarzeniach w następnym rozdziale tego podręcznika.
Ten przykład zmienia styl elementu HTML z id="id1" , gdy użytkownik kliknie przycisk:
Przykład
<!DOCTYPE html>
<html>
<body>
<h1 id="id1">My Heading 1</h1>
<button type="button"
onclick="document.getElementById('id1').style.color = 'red'">
Click Me!</button>
</body>
</html> Spróbuj sam " Więcej przykładów
Widoczność Jak elementem niewidoczne. Chcesz pokazać element, czy nie?
HTML DOM Style Object Reference
Dla wszystkich właściwości stylu HTML DOM, spojrzeć na naszą kompletną HTML DOM Style odwołanie do obiektu .
Sprawdź się z ćwiczeń!
Ćwiczenie 1 » Ćwiczenie 2» Ćwiczenie 3 » Ćwiczenia 4» Zadanie 5 »