Mis on JavaScriptis HTML DOM-i elemendi eelnev atribuut ElementSibling

Mis On Javascriptis Html Dom I Elemendi Eelnev Atribuut Elementsibling



DOM vastab ' Dokumendiobjekti mudel ”, mis luuakse HTML-lehe laadimisel veebibrauseris. See esindab puuobjekti, millel on üks juursõlm ja mitu ülem- ja alamsõlme. Põhimõtteliselt tähistab see praegusel veebilehel kasutatavate HTML-elementide hierarhilist struktuuri. Kasutaja saab sealt lihtsalt ja kiiresti otsida vajalikke vanem- ja alamsõlme. Lisaks võimaldab see kasutajal juurde pääseda ka elemendi õdedele-vendadele. See võib olla sihtsõlme suhtes järgmine või eelmine vend. JavaScriptis pääseb eelmisele sõsarsõlmele/elemendile juurde, kasutades ' eelmineElement Õde-vend ” vara.

See postitus selgitab JavaScripti kasutades HTML DOM-i elemendi 'previousElementSibling' atribuuti.

Mis on HTML DOM-i elemendi „previousElementsibling” atribuut?

DOM (Dokumendiobjekti mudel) element ' eelmineElement Õde-vend ” on kirjutuskaitstud atribuut, mis aitab hankida samas puus oleva elemendi eelmist sõsarat. See atribuut tagastab eelmise õe-venna sisu.







Süntaks



element. eelmineElement Õde-vend

See süntaks tagastab ' string ', mis sisaldab eelmise õe-venna HTML-i sisu ja ' null ”, kui seda pole olemas.







Kasutame ülalmääratletud süntaksit praktiliselt, et näidata atribuudi „previousElementSibling” toimimist.



Näide: atribuudi „previousElementsibling” rakendamine eelmise õe-venna sisu tagastamiseks

See näide rakendab JavaScripti atribuuti „previousElementSibling”, et hankida eelmise õe-venna HTML-sisu.

HTML-kood

Esiteks ülevaade järgmisest HTML-koodist:

< ul >
< et id = 'esimene' > HTML < / et >
< et id = 'teine' > CSS < / et >
< et id = 'kolmas' > JavaScript < / et >
< / ul >
< lk id = 'eest' >< / lk >

Ülaltoodud koodiridades:

  • '
      ” silt lisab järjestamata loendi.
    • Järjestamata loendisse manustatakse mitu üksust, kasutades ' ” sildi neile määratud ID-dega.
    • Lõpuks, '

      ” silt manustab tühja lõigu kordumatu ID-ga „para”.

    JavaScripti kood

    Nüüd jätkake JavaScripti koodiga:

    < stsenaarium >
    lase ese = dokument. getElementById ( 'kolmas' ) . eelmineElement Õde-vend . sisemine HTML ;
    dokument. getElementById ( 'eest' ) . sisemine HTML = ' Kolmanda üksuse eelmine vend on : ' + üksus ;
    stsenaarium >

    Ülaltoodud koodilõigu järgi:

    • Muutuja „üks” kasutab esmalt „ getElementById() ' meetodit, et pääseda juurde sihitud loendiüksusele, kasutades selle ID-d 'kolmas' ja seejärel rakendada ' eelmineElement Õde-vend ” vara, et saada oma eelmine õde-vend.
    • Pärast seda ' getElementById() Meetod pääseb lisatud tühjale lõigule juurde, kasutades selle ID-d 'para', et lisada sellele muutuja 'üks' väärtus, st eelmine õde.

    Väljund

    Nagu näha, näitab tulemus sihitud üksuse eelmist õde, st (JavaScript).

    Järeldus

    JavaScript pakub eelmääratletud DOM-i elementi ' eelmineElement Õde-vend ” atribuut elemendi eelmise venna hankimiseks. See tagastab elemendi eelmise venna samalt puutasemelt, kus asub sihtelement. See postitus selgitas põhjalikult HTML DOM-i elemendi „previousElementSibling” atribuuti JavaScriptis.