Et dokumentobjekt representerer dokumentet som vises i det vinduet. Dokumentobjektet har forskjellige egenskaper som refererer til andre objekter som gir tilgang til og endring av dokumentinnhold. I denne artikkelen vil vi forstå HTML DOM.
- HTML DOM-konsept
- Hva HTML DOM er
- Hva HTML DOM er IKKE
- Hvor DOM kom fra
- Egenskaper for HTML DOM
- Finne HTML-elementer
HTML DOM-konsept
Måten et dokumentert innhold er tilgjengelig og endret på, kalles Dokumentobjektmodell , eller DOM. Objektene er organisert i et hierarki. Denne hierarkiske strukturen gjelder organisering av objekter i et webdokument.
- Vindusobjekt og minus Topp i hierarkiet. Det er det største elementet i objekthierarkiet.
- Dokumentobjekt og minus Hvert HTML-dokument som lastes inn i et vindu, blir et dokumentobjekt. Dokumentet inneholder innholdet på siden.
- Skjemaobjekt og minus Alt vedlagt i ... -kodene setter skjemaobjektet.
- Skjemakontrollelementer og minus Skjemaobjektet inneholder alle elementene som er definert for det objektet, for eksempel tekstfelt, knapper, radioknapper og avkrysningsruter.
Hva HTML DOM er
Document Object Model er et programmerings-API for dokumenter. Selve objektmodellen ligner strukturen på dokumentene den modellerer. Tenk for eksempel på denne tabellen, hentet fra et HTML-dokument:
| Shady Grove | Eolisk |
| Over River, Charlie | Dorian |
Hva HTML DOM er IKKE
Denne delen er utformet for å gi en mer presis forståelse av Document Object Model ved å skille den fra andre systemer som kan se ut som den.
Selv om dokumentobjektmodellen ble sterkt påvirket av dynamisk HTML, implementerer den ikke nivå dynamisk i nivå 1. Spesielt er hendelser ennå ikke definert. Nivå 1 er designet for å legge et solid grunnlag for denne typen funksjonalitet ved å tilby en robust, fleksibel modell av selve dokumentet.
hvordan lære pl sql
Document Object Model er ikke en binær spesifikasjon. Document Object Model-programmer skrevet på samme språk vil være kildekode kompatible på tvers av plattformer, men Document Object Model definerer ikke noen form for binær interoperabilitet.
Document Object Model er ikke en måte å vedvare objekter til XML eller HTML. I stedet for å spesifisere hvordan objekter kan være representert i XML, spesifiserer Document Object Model hvordan XML- og HTML-dokumenter blir representert som objekter, slik at de kan brukes i objektorienterte programmer.
Document Object Model er ikke et sett med datastrukturer, det er en objektmodell som spesifiserer grensesnitt. Selv om dette dokumentet inneholder diagrammer som viser foreldre / barn-forhold, er dette logiske forhold definert av programmeringsgrensesnittene, ikke representasjoner av noen spesielle interne datastrukturer.
Document Object Model definerer ikke 'den virkelige indre semantikken' i XML eller HTML. Semantikken til disse språkene er definert av språkene selv.
koblet og ikke-koblet transformasjon i informatica
Document Object Model er en programmeringsmodell designet for å respektere denne semantikken. Dokumentobjektmodellen har ingen konsekvenser for måten du skriver XML- og HTML-dokumenter, noe dokument som kan skrives på disse språkene, kan vises i dokumentobjektmodellen.
Document Object Model, til tross for navnet, er ikke en konkurrent til Component Object Model (COM). COM, som CORBA, er en språkuavhengig måte å spesifisere grensesnitt og objekter på. Dokumentobjektmodellen er et sett med grensesnitt og objekter designet for å administrere HTML- og XML-dokumenter. DOM kan væreimplementert ved hjelp av språkuavhengige systemer som COM eller CORBA, kan det også implementeres ved hjelp av språkspesifikke bindinger som Java- eller ECMAScript-bindinger spesifisert i dette dokumentet.
Hvor dokumentobjektmodellen kom fra
Document Object Model stammer fra en spesifikasjon som tillater JavaScript-skript og Java-programmer å være bærbare blant nettlesere. Dynamisk HTML var nærmeste forfader til Document Object Model, og det ble opprinnelig tenkt på i stor grad når det gjelder nettlesere.
Når arbeidsgruppen for dokumentobjektmodell ble dannet, fikk den imidlertid også selskap av andre domener, inkludert HTML- eller XML-redigerere og dokumentrepositorier. Flere av disse leverandørene hadde jobbet med SGML før XML ble utviklet som et resultat, Document Object Model har blitt påvirket av SGML Groves og HyTime-standarden. Noen av disse leverandørene hadde også utviklet egne objektmodeller for dokumenter for å kunne levereprogrammering av API-er for SGML / XML-redaktører eller dokumentregister, og disse objektmodellene har også påvirket Document Object Model.
Egenskaper for HTML DOM
La oss se egenskapene til dokumentobjektene som er tilgjengelige og endres av dokumentobjektet.
- Vindusobjekt: Window Object er alltid øverst i hierarkiet.
- Dokumentobjekt: Når et HTML-dokument lastes inn i et vindu, blir det et dokumentobjekt.
- Skjemaobjekt: Det er representert av skjema koder.
- Lenkeobjekter: Det er representert av lenke koder.
- Ankerobjekter: Det er representert av en href koder.
- Elementkontrollelementer: Skjema kan ha mange kontrollelementer som tekstfelt, knapper, radioknapper og avkrysningsruter osv.
Metoder av dokumentobjekt :
- skriv (“streng”): skriver gitt streng på dokumentet.
- getElementById (): returnerer elementet som har den gitte id-verdien.
- getElementsByName (): returnerer alle elementene som har den gitte navnverdien.
- getElementsByTagName (): returnerer alle elementene som har det gitte kodenavnet.
- getElementsByClassName (): returnerer alle elementene som har gitt klassenavn.
Finne HTML-elementer
Når du vil ha tilgang til HTML-elementer med JavaScript, må du finne elementene først.
Det er et par måter å gjøre dette på:
- Finne HTML-elementer etter id
- Finne HTML-elementer etter taggenavn
- Finne HTML-elementer etter klassenavn
Finne HTML-element etter ID
Den enkleste måten å finne et HTML-element i DOM, er å bruke element-id.
Eksempel
Finne HTML-elementer etter taggenavn
hvordan du bruker visual studio
Dette eksemplet finner elementet med id = ”main”, og finner deretter alt
elementer inne i 'hoved':
Med dette kommer vi til en slutt på denne HTML DOM-artikkelen. Jeg håper du fikk forståelse for de forskjellige aspektene av HTML DOM, Document Object Model.
Sjekk ut vår som kommer med instruktørstyrt liveopplæring og reell prosjektopplevelse. Denne opplæringen gjør deg dyktig i ferdigheter til å jobbe med back-end og front-end web-teknologier. Det inkluderer opplæring i webutvikling, jQuery, Angular, NodeJS, ExpressJS og MongoDB.
Har du spørsmål til oss? Vennligst nevn det i kommentarfeltet på 'HTML Images' -bloggen, så kommer vi tilbake til deg.