Tämä viesti selittää HTML DOM -elementin 'previousElementSibling' -ominaisuuden JavaScriptin avulla.
Mikä on HTML DOM -elementin 'previousElementSibling' -ominaisuus?
DOM (Document Object Model) -elementti ' edellinenElementtisisarus ” on vain luku -ominaisuus, joka auttaa hakemaan saman puun elementin edellisen sisaruksen. Tämä ominaisuus palauttaa edellisen sisaruksen sisällön.
Syntaksi
elementti. edellinenElementtisisarus
Tämä syntaksi palauttaa ' merkkijono ', joka sisältää edellisen sisaruksen HTML-sisällön, ja ' tyhjä 'jos sitä ei ole olemassa.
Käytetään yllä määriteltyä syntaksia käytännössä näyttämään 'previousElementSibling' -ominaisuuden toiminta.
Esimerkki: 'previousElementsibling' -ominaisuuden käyttäminen edellisen sisaruksen sisällön palauttamiseen
Tämä esimerkki käyttää JavaScriptin 'previousElementSibling' -ominaisuutta saadakseen edellisen sisaruksen HTML-sisällön.
HTML-koodi
Ensin yleiskatsaus seuraavaan HTML-koodiin:
< ul >< että id = 'ensimmäinen' > HTML < / että >
< että id = 'toinen' > CSS < / että >
< että id = 'kolmas' > JavaScript < / että >
< / ul >
< s id = 'for' >< / s >
Yllä olevilla koodiriveillä:
- '
- Järjestämättömään luetteloon upotetaan useita kohteita käyttämällä '
” -tunnisteen niille määritetyillä tunnuksilla. - Lopuksi ' ' -tunniste upottaa tyhjän kappaleen, jossa on yksilöllinen tunnus 'para'.
JavaScript-koodi
Jatka nyt JavaScript-koodilla:
< käsikirjoitus >anna esine = asiakirja. getElementById ( 'kolmas' ) . edellinenElementtisisarus . innerHTML ;
asiakirja. getElementById ( 'for' ) . innerHTML = ' Kolmannen kohteen edellinen sisarus on : ' + kohde ;
käsikirjoitus >
Yllä olevan koodinpätkän mukaan:
- 'tuote'-muuttuja käyttää ensin ' getElementById() ' -menetelmää päästäksesi kohdistettuun luettelokohteeseen sen tunnuksella 'kolmas' ja käytä sitten ' edellinenElementtisisarus ” omaisuutta saadakseen entisen sisaruksensa.
- Sen jälkeen ' getElementById() ' -menetelmä käyttää lisättyä tyhjää kappaletta käyttämällä id 'para' -tunnusta lisätäkseen sen 'item'-muuttujan arvon eli edellisen sisaruksen kanssa.
Lähtö
Kuten näkyy, tulos näyttää kohdetuotteen edellisen sisaruksen eli (JavaScriptin).
Johtopäätös
JavaScript tarjoaa ennalta määritellyn DOM-elementin ' edellinenElementtisisarus ”-ominaisuus noutaa elementin edellisen sisaruksen. Se palauttaa elementin edellisen sisaruksen samalta puutasolta, jossa kohdeelementti sijaitsee. Tämä viesti selitti perusteellisesti HTML DOM -elementin 'previousElementSibling' -ominaisuuden JavaScriptissä.