HTML DOM: Asiakirjaobjektimallin käyttäminen

Document-objekti edustaa kyseisessä ikkunassa näytettävä asiakirja. Asiakirja-objektilla on useita ominaisuuksia, jotka viittaavat muihin objekteihin, jotka mahdollistavat pääsyn asiakirjan sisältöön ja muokkaamisen. Tässä artikkelissa ymmärretään HTML DOM.

• HTML DOM -konsepti
• Mikä HTML DOM on
• Mikä HTML DOM EI OLE
• Mistä DOM tuli
• HTML DOM: n ominaisuudet
• HTML-elementtien etsiminen

HTML DOM -konsepti

Tapaa, jolla dokumentoitua sisältöä pääsee käsiksi ja muunnetaan, kutsutaan Asiakirjan objektimalli tai DOM. Objektit on järjestetty hierarkiaan. Tämä hierarkkinen rakenne koskee Web-asiakirjan objektien järjestämistä.

• Ikkunaobjekti ja miinus hierarkian yläosa. Se on objektihierarkian äärimmäinen osa.
• Asiakirjaobjekti ja miinus Jokaisesta HTML-dokumentista, joka ladataan ikkunaan, tulee asiakirjaobjekti. Asiakirja sisältää sivun sisällön.
• Lomakeobjekti ja miinus Kaikki… -tagien sisällä olevat asetetaan lomakeobjekti.
• Lomakkeen ohjauselementit ja miinus Lomakeobjekti sisältää kaikki tälle objektille määritetyt elementit, kuten tekstikentät, painikkeet, valintanapit ja valintaruudut.

Mikä HTML DOM on

Document Object Model on ohjelmointirajapinta asiakirjoille. Objektimalli muistuttaa läheisesti mallintamiensa asiakirjojen rakennetta. Harkitse esimerkiksi tätä taulukkoa, joka on otettu HTML-dokumentista:

 
 
 
Shady Grove
 
Lipari
 
 
 
Joen yli, Charlie
 
Dorian
 
    

Mikä HTML DOM EI OLE

Tämä osa on suunniteltu antamaan tarkempi käsitys asiakirjaobjektimallista erottamalla se muista järjestelmistä, jotka saattavat näyttää olevan samanlaisia.

Vaikka dynaaminen HTML vaikutti voimakkaasti asiakirjaobjektimalliin, tasossa 1 se ei ota käyttöön kaikkea dynaamista HTML: ää. Erityisesti tapahtumia ei ole vielä määritelty. Taso 1 on suunniteltu luomaan vankka perusta tällaiselle toiminnalle tarjoamalla vankka ja joustava malli itse dokumentista.

Asiakirjaobjektimalli ei ole binäärinen määritys. Samalla kielellä kirjoitetut Document Object Model -ohjelmat ovat lähdekoodien mukaisia ​​kaikilla alustoilla, mutta Document Object Model ei määritä minkäänlaista binääristä yhteentoimivuutta.

käyttämällä r koneoppimiseen

Asiakirjaobjektimalli ei ole tapa säilyttää objekteja XML: ään tai HTML: ään. Sen sijaan, että määritettäisiin, kuinka objekteja voidaan esittää XML: ssä, Document Object Model määrittää, miten XML- ja HTML-asiakirjat esitetään objekteina, jotta niitä voidaan käyttää olio-ohjelmissa.

Document Object Model ei ole joukko tietorakenteita, se on objektimalli, joka määrittää rajapinnat. Vaikka tämä asiakirja sisältää kaavioita, jotka esittävät vanhemman ja lapsen välisiä suhteita, nämä ovat ohjelmointirajapintojen määrittelemiä loogisia suhteita, eivät kuitenkaan minkään erityisen sisäisen tietorakenteen esityksiä.

Asiakirjaobjektimalli ei määritä XML: n tai HTML: n 'todellista sisäistä semantiikkaa'. Näiden kielten semantiikan määrittelevät itse kielet.

Document Object Model on ohjelmointimalli, joka on suunniteltu kunnioittamaan näitä semantiikkoja. Asiakirjaobjektimallilla ei ole seurauksia XML- ja HTML-asiakirjojen kirjoittamistavalle, mikä tahansa näillä kielillä kirjoitettava asiakirja voidaan edustaa asiakirjaobjektimallissa.

Asiakirjaobjektimalli ei nimestään huolimatta ole kilpailija komponenttiobjektimallilla (COM). COM, kuten CORBA, on kielestä riippumaton tapa määrittää rajapinnat ja objektit. Document Object Model on joukko rajapintoja ja objekteja, jotka on suunniteltu HTML- ja XML-dokumenttien hallintaan. DOM voi ollatoteutetaan kielestä riippumattomilla järjestelmillä, kuten COM tai CORBA, se voidaan toteuttaa myös käyttämällä kielikohtaisia ​​sidoksia, kuten tässä asiakirjassa määriteltyjä Java- tai ECMAScript-sidoksia.

Mistä asiakirjaobjektimalli tuli

Asiakirjaobjektimalli on peräisin spesifikaatiosta, jotta JavaScript-komentosarjat ja Java-ohjelmat voivat olla kannettavia verkkoselaimissa. Dynaaminen HTML oli asiakirjaobjektimallin välitön esi-isä, ja alun perin ajateltiin suurimmaksi osaksi selainten suhteen.

on jatko-opiskelija sama kuin päälliköt

Kun asiakirjaobjektimallityöryhmä muodostettiin, siihen liittyivät myös toimittajat muilla toimialueilla, mukaan lukien HTML- tai XML-editorit ja asiakirjavarastot. Useat näistä toimittajista olivat työskennelleet SGML: n kanssa ennen kuin XML kehitettiin. SGML Groves ja HyTime-standardi ovat vaikuttaneet Document Object Model -malliin. Jotkut näistä myyjistä olivat myös kehittäneet omat objektimallinsa asiakirjoille toimittamista vartenohjelmointisovellusliittymät SGML / XML-muokkaajille tai asiakirjavarastoille, ja nämä objektimallit ovat vaikuttaneet myös asiakirjaobjektimalliin.

HTML DOM: n ominaisuudet

Katsotaan niiden dokumenttiobjektien ominaisuuksia, joita asiakirjaobjekti voi käyttää ja muokata.

1. Ikkunaobjekti: Ikkunaobjekti on aina hierarkian yläosassa.
2. Asiakirjaobjekti: Kun HTML-asiakirja ladataan ikkunaan, siitä tulee dokumenttiobjekti.
3. Lomakkeen objekti: Sitä edustaa muodossa tunnisteet.
4. Linkki objektit: Sitä edustaa linkki tunnisteet.
5. Ankkurikohteet: Sitä edustaa href tunnisteet.
6. Lomakkeen ohjauselementit: Lomakkeessa voi olla monia ohjauselementtejä, kuten tekstikentät, painikkeet, valintanapit ja valintaruudut jne.

Menetelmät asiakirjan objektista :

1. kirjoita ('merkkijono'): kirjoittaa annetun merkkijonon asiakirjaan.
2. getElementById (): palauttaa elementin, jolla on annettu id-arvo.
3. getElementsByName (): palauttaa kaikki elementit, joilla on annettu nimi-arvo.
4. getElementsByTagName (): palauttaa kaikki elementit, joilla on annettu tagin nimi.
5. getElementsByClassName (): palauttaa kaikki elementit, joilla on annettu luokan nimi.

HTML-elementtien etsiminen

Kun haluat käyttää HTML-elementtejä JavaScriptillä, sinun on löydettävä ne ensin.

Voit tehdä tämän muutamalla tavalla:

• HTML-elementtien etsiminen tunnuksen perusteella
• HTML-elementtien etsiminen tagin nimen mukaan
• HTML-elementtien etsiminen luokan nimen mukaan

HTML-elementin etsiminen tunnuksen perusteella

Helpoin tapa löytää HTML-elementti DOM: sta on käyttää elementin tunnusta.

Esimerkki

HTML-elementtien etsiminen tagin nimen perusteella

Tämä esimerkki löytää elementin, jonka id = ”main”, ja etsii sitten kaikki

elementit sisällä “main”:

Tämän avulla olemme päässeet tämän HTML DOM -artikkelin loppuun. Toivon, että sait käsityksen HTML DOM: n, Document Object Model, eri näkökohdista.

tietorakenteet ja algoritmit java

Katso meidän joka sisältää ohjaajan vetämän live-koulutuksen ja tosielämän projektikokemuksen. Tämä koulutus antaa sinulle taitoja työskennellä back-end- ja front-end-verkkoteknologioiden kanssa. Se sisältää koulutusta verkkokehityksestä, jQuerystä, Angularista, NodeJS: stä, ExpressJS: stä ja MongoDB: stä.

Onko sinulla kysymys meille? Mainitse se HTML-kuvat-blogin kommenttiosassa ja palaamme sinuun.