HTML5 - DOM del 1

Innholdsfortegnelse
De SOL som refererer til DokumentobjektmodellDet er ikke annet enn en objektrepresentasjon av elementene i HTML -dokumentet vårt, takket være dette kan vi lage en dypere forbindelse med Javascript, og det oppnår veldig interessante effekter; For å komme til det nivået må vi imidlertid først vite godt hvordan vi skal håndtere oss selv i DOM for implementering og bruk.
Forstå DOM
Utvide konseptet med SOL Vi kan også legge til at det er en samling objekter som representerer HTML I dokumentet ser vi i navnet hva en modell er, og nøkkelordet den representerer er en representativ modell av HTML -dokumentet.
DOM er et sentralt verktøy i WEB -utvikling, siden det gir oss en bro mellom strukturen og innholdet mellom våre HTML- og Javascript -dokumenter.
Modellen vi snakker om er opprettet av nettleseren når den tolker HTML -koden, grunnstrukturen til en DOM kan sees på følgende måte i et diagram i følgende bilde:

Som vi kan se, er det basert på en hierarkisk struktur, med dette oppnår vi at vi kan bruke banene til disse forholdene for å skaffe informasjon eller gjøre strukturelle endringer via Javascript.
Tester DOM
Vi skal utføre noen enkle tester på dokumentet vårt, slik at vi blir vant til hvordan du kan jobbe med det. SOL, en av de første testene vi kan utføre er å bekrefte at en funksjonalitet er tilgjengelig i dokumentet, la oss se i følgende kode:
 Eksempel

Det er mange forskjellige frukttyper - det er over 500 varianter av bananer alene. Når vi legger til de utallige typer epler, appelsiner og annen kjent frukt, står vi overfor tusenvis av valg.


Her gjorde vi bare noe enkelt, først sjekker vi om metoden eksisterer querySelectorAll, hvis den eksisterer så tildeler vi en variabel innholdet i alle elementene img de har id paratekstettersom vi sjekker i tilfelle det mislykkes, bruker vi en annen måte for å skaffe de samme dataene, i dette tilfellet er det getElementById og senere getElementByTagNameTil slutt, med vår definerte variabel, gjentar vi gjennom innholdet og endrer CSS -egenskapene.
Kanskje det negative vi kan se er at hvis vi har mange verifikasjoner, kan koden vår bli kompleks og uleselig, alt er et spørsmål om kompromisser mellom det vi ønsker å oppnå og måten å oppnå det på, på denne måten kan vi få våre resultater.
I den neste delen av denne opplæringen vil vi se på noen mer avanserte eksempler på hvordan du kan fortsette å jobbe med DOM.Likte og hjalp du denne opplæringen?Du kan belønne forfatteren ved å trykke på denne knappen for å gi ham et positivt poeng

Du vil bidra til utvikling av området, dele siden med vennene dine

wave wave wave wave wave