HTML5 - DOM część 1

ten SŁOŃCE co odnosi się do Obiektowy model dokumentuTo nic innego jak obiektowa reprezentacja elementów, które znajdują się w naszym dokumencie HTML, dzięki temu możemy nawiązać głębsze połączenie z Javascriptem i osiąga bardzo ciekawe efekty; Jednak, aby osiągnąć ten poziom, musimy najpierw bardzo dobrze wiedzieć, jak radzić sobie w DOM w celu jego implementacji i użytkowania.
Zrozumienie DOM
Rozszerzenie koncepcji SŁOŃCE Możemy również dodać, że jest to zbiór obiektów reprezentujących HTML W dokumencie, w jego nazwie widzimy czym jest model, a słowo kluczowe, które reprezentuje, jest reprezentatywnym modelem dokumentu HTML.
DOM jest kluczowym narzędziem w tworzeniu stron internetowych, ponieważ zapewnia nam pomost między strukturą a treścią między naszymi dokumentami HTML i JavaScript.
Model, o którym mówimy, jest tworzony przez przeglądarkę podczas interpretacji kodu HTML, podstawową strukturę DOM można zobaczyć w następujący sposób na diagramie na poniższym obrazku:

Jak widać, opiera się na strukturze hierarchicznej, dzięki czemu uzyskujemy możliwość wykorzystania ścieżek tych relacji do pozyskiwania informacji lub wprowadzania zmian strukturalnych za pomocą Javascript.
Testowanie DOM
Przeprowadzimy kilka prostych testów na naszym dokumencie, aby przyzwyczaić się do tego, jak możesz z nim pracować. SŁOŃCE, jednym z pierwszych testów, które możemy wykonać, jest sprawdzenie, czy w dokumencie jest dostępna funkcjonalność, zobaczmy w poniższym kodzie:

 Przykład
Istnieje wiele różnych rodzajów owoców - tylko ponad 500 odmian bananów. Zanim dodamy niezliczone rodzaje jabłek, pomarańczy i innych dobrze znanych owoców, stajemy przed tysiącami wyborów. 

Tutaj po prostu zrobiliśmy coś prostego, najpierw sprawdzamy, czy metoda istnieje zapytanieSelectorAll, jeśli istnieje to do zmiennej przypisujemy zawartość wszystkich elementów obrazek mają identyfikator paratekst, ponieważ wykonujemy kontrolę na wypadek niepowodzenia, korzystamy z innego sposobu uzyskania tych samych danych, w tym przypadku jest to getElementById i później getElementByTagNameW końcu, po prostu z naszą zdefiniowaną zmienną, iterujemy po jej zawartości i zmieniamy ich właściwości CSS.
Być może tutaj negatywem, który widzimy, jest to, że jeśli mamy wiele weryfikacji, nasz kod może stać się skomplikowany i nieczytelny, wszystko jest kwestią kompromisów między tym, co chcemy osiągnąć, a sposobem osiągnięcia tego, w ten sposób możemy uzyskać nasze wyniki.
W następnej części tego samouczka przyjrzymy się bardziej zaawansowanym przykładom dalszej pracy z DOM.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt