Sett inn HTML i en div - JavaScript

Sett inn HTML i en div - JavaScript
I mange tilfeller er det behov for å legge til data dynamisk på nettstedene, for eksempel på sosiale medier fora, nettbutikker, nyhetsnettsteder, dashboards og så videre. Mer spesifikt kan ethvert nettsted som viser endrede data eller innhold kreve dynamiske oppdateringer ved hjelp av JavaScript eller andre webutviklingsverktøy.

Denne artikkelen vil beskrive hvordan du setter inn en HTML i et DIV -element i JavaScript.

Hvordan sette inn HTML i en div ved hjelp av JavaScript?

Ettersom JavaScript er et dynamisk språk og brukes dynamisk. Så for dette formålet, bruk JavaScript -forhåndsbygde attributter. For å sette inn en HTML i en div, bruk følgende tilnærminger:

  • Innerhtml eiendom
  • Innertext -eiendom

Metode 1: Sett inn HTML i en div ved hjelp av egenskapen “Innerhtml”

Bruke "indrehtml”Eiendom for å sette inn HTML i en div. Den kan hente HTML -innholdet i et element som en streng eller angi nytt HTML -innhold for et element, inkludert tekst eller HTML -koder.

Syntaks

Bruk den gitte syntaks for InnerHTML -egenskapen for å legge HTML i en div i JavaScript:

element.indrehtml

Eksempel

Lag en div i et HTML -element ved hjelp av TAG og knytte en ID “InsertText

I en JavaScript -fil eller taggen, få referansen til DIV -elementet ved å bruke den tildelte ID -en og bruke “indrehtml”Attributt til å angi teksten med ankerlenken:

dokument.getElementById ("InsertText").INNERHTML = "Velkommen til Linuxhint";

Som du kan se at teksten med lenken har blitt satt inn på siden ved hjelp av JavaScript:

Metode 2: Sett inn HTML i en div ved hjelp av egenskapen "Innertekst"

En annen måte å sette inn HTML i en div er å bruke “Innertekst”Eiendom. Det kan få/hente HTML -elementets tekstinnhold eller angi nytt tekstinnhold for et HTML -element.

Syntaks

Bruk følgende syntaks for Innertext -egenskap:

element.Innertekst

Eksempel

Her vil vi legge til teksten i DIV -elementet ved å bruke InterText -attributtet:

dokument.getElementById ("InsertText").innertekst = "hy! Jeg setter inn i denne diven ved hjelp av 'innereksten' eiendom ';

Produksjon

Det handler om å sette inn HTML i en div ved hjelp av JavaScript.

Konklusjon

For å sette inn HTML -tagger og tekst i et HTML DIV -element, bruk "indrehtml”Eiendom, og for bare å sette inn tekst på DIV -elementet, bruk"Innertekst”Eiendom. Denne artikkelen beskrev måtene å sette inn en HTML i en div ved hjelp av JavaScript.