Czy wiesz, że możemy używać JavaScript do manipulowania treścią na stronie internetowej? Wydaje się interesujące, prawda? Zrozummy, czym jest model obiektu dokumentu, tj. DOM w JavaScript w następujący sposób:
- Co to jest DOM w JavaScript?
- Działania DOM w JavaScript
- Zapytanie do DOM
- Słuchanie wydarzeń
- Interakcja z Formsami
- Tworzenie elementów HTML
- Dodawanie CSS
Co to jest DOM w JavaScript?
Model obiektu dokumentu lub DOM jest tworzony przez przeglądarkę podczas ładowania strony internetowej. W formie graficznej przypomina drzewo elementów zwanych także węzłami, które reprezentują każdy element na stronie.
Cały DOM naszej strony internetowej znajduje się wewnątrz obiektu dokumentu. Programowo ten model pozwala nam czytać, a nawet zmieniać zawartość naszej strony za pośrednictwem . Czy to nie jest fajne?
program do planowania okrężnego w c
Działania DOM w JavaScript
Niektóre z czynności, które możemy wykonać za pomocą tego modelu to:
Zmień / usuń elementy HTML w DOM / na stronie.
Zmieniaj i dodawaj style CSS do elementów
Odczyt i zmiana atrybutów (href, src, alt) itp.
rzut podwójny na int java
Utwórz nowe elementy i wstaw je do DOM / strony.
Dołącz detektory zdarzeń do elementów (kliknięcie, naciśnięcie klawisza, przesłanie)
Zapytanie do DOM w JavaScript
Chwytanie elementu HTML lub przechwytywanie go w celu dodania / zmiany lub zawartości nazywa się zapytaniem.
Kod HTML:
JavaScript i DOM h1 {font-size: 60px}Kod JavaScript:
var title = document.getElementById ('title') // zmień kolor na czerwony title.style.color = 'red' var body = document.getElementById ('body') // zmiana koloru tła na jasnoniebieski body.style. backgroundColor = 'jasnoniebieski'Zmieniliśmy kolor tekstu tytułu z czarnego na czerwony za pomocą JavaScript. Osiągnęliśmy to za pomocą .styl właściwość następnie zmieniła wartość kolor równe netto .
Teraz zmieńmy kolor tła elementu body na jasny niebieski .
użycie iteratora w java
W ten sposób dochodzimy do końca tego artykułu DOM w JavaScript. Mam nadzieję, że rozumiesz, jak działają modele obiektów dokumentów i jak zaimplementować ten sam DOM w JavaScript.
Teraz, gdy wiesz już o DOM w JavaScript, zapoznaj się z przez Edureka. Szkolenie z zakresu certyfikacji w zakresie rozwoju sieci pomoże Ci nauczyć się, jak tworzyć imponujące strony internetowe przy użyciu HTML5, CSS3, Twitter Bootstrap 3, jQuery i interfejsów API Google oraz wdrażać je w usłudze Amazon Simple Storage Service (S3).
Masz do nas pytanie? Wspomnij o tym w sekcji komentarzy „DOM w JavaScript”, a my skontaktujemy się z Tobą.