Hvad gør insertAdjacentHTML() Method i JavaScript

Denne vejledning forklarer formålet, arbejdet og brugen af ​​metoden 'insertAdjacent HTML()' i JavaScript.

Hvad gør metoden 'insertAdjacentHTML()' i JavaScript?

Det ' indsætAdjacentHTML() ”-metoden hjælper brugerne med at indsætte HTML-koden i en bestemt position.

Syntaks

I ovenstående syntaks:

• element : Det repræsenterer det tilknyttede HTML-element.
• position : Den specificerer de fire relative positioner af et HTML-element, som følger:
• før begyndelse : Før HTML-elementet.
• efterbegyndelse : Lige efter det første underordnede af HTML-elementet.
• efterafslutning : I slutningen af ​​HTML-elementet.
• forinden : Efter det sidste underordnede af HTML-elementet.
• html : Det refererer til det indsatte HTML-element.

Eksempel: Anvendelse af 'insertAdjacentHTML()' til at indsætte elementer i relative positioner
Dette eksempel anvender den omtalte metode til at indsætte elementerne på de fire specifikke positioner i forhold til et bestemt element, dvs.

”.

---





---

HTML kode
Først skal du gennemgå følgende HTML-kode:

< h2 > insertAdjacentHTML() Metode i JavaScript < / h2 >
< ul id = 'demo' >
< at > Linux < / at >
< / ul >

I ovenstående kodestykke:




• Først skal du oprette en underoverskrift ved hjælp af '

  ” tag.

• Brug derefter '
  ” tag for at oprette den uordnede liste med et tildelt id “demo”.
  • Det ' ' tag tilføjer det angivne element på listen.

  JavaScript kode
  Gå nu videre til JavaScript-kodeblokken:

  < manuskript >
  lad liste = dokument. getElementById ( 'demo' ) ;
  liste. indsætAdjacentHTML ( 'før start' , '

  operativsystemer

  ' ) ;
  liste. indsætAdjacentHTML ( 'efterbegyndelse' , '
• Windows
' ) ;
liste. indsætAdjacentHTML ( 'før' , '
• Mac OS
' ) ;
liste. indsætAdjacentHTML ( 'efter end' , '

Det er alt

' ) ;
manuskript >

I ovenstående kodestykke:

• Erklære en variabel ' liste ', der bruger ' getElementById() ' metode til at hente den inkluderede '
  ' element, der omfatter id ' demo ”.
  • Anvend derefter ' indsætAdjacentHTML() '-metoden til at indsætte underoverskriften via '

    '-tagget før starten af ​​'

    ', dvs. ved ' før begyndelse ” stilling.
    • Indsæt derefter varen via ' ” tag efter starten af ​​“
      ” tagget, dvs. ved “ efterbegyndelse ” stilling.
      • Brug igen ' ' tag for at tilføje et listeelement før slutningen af ​​'
        ' tagget, dvs. ved ' forinden ” stilling.
        • Til sidst skal du indsætte et afsnit ved hjælp af '

          '-tagget efter slutningen af ​​'

          '-tagget ved ' efterafslutning ” stilling.

          Produktion
          

          Som det ses, indsættes alle de definerede HTML-elementer på deres tildelte position ved hjælp af ' indsætAdjacentHTML() ” metode.

          Konklusion

          JavaScript giver en velrenommeret indbygget ' indsætAdjacentHTML() ” metode til at tilføje HTML-elementet på fire forskellige positioner. Det instruerer browseren om at justere det angivne HTML-element ved ' før begyndelse ', ' forinden ', ' efterbegyndelse ', og ' efterafslutning ” positioner i forhold til et bestemt element. Denne vejledning diskuterede arbejdet og brugen af ​​metoden 'insertAdjacentHTML()' i detaljer.