Innerhtml kan brukes til å skrive HTML -dokumentet dynamisk. Det er stort sett distribuert for å generere dynamiske HTML -dokumenter, inkludert kommentarskjemaer, registreringsskjemaer, lenker og mange flere. Videre kan du også erstatte Innerhtml inne i en div ved hjelp av jQuery. For å gjøre det, “.html ()”Funksjon brukes. Når du klikker på knappen når nettstedet har lastet inn, vil innholdet inne i Div bli endret med innholdet fra HTML () -funksjonen.

Denne oppskrivningen vil demonstrere å erstatte innermlen til en div som bruker jQuery.

Hvordan erstatte Innerhtml av en div ved hjelp av jQuery?

Følg den innerhtml til en div container som bruker jQuery, følg den under-uttalte prosedyren.

Trinn 1: Lag en hoved "div" container

Opprinnelig lage den viktigste “div” -beholderen ved å bruke “”Element og legg til en ID i“ Div ”åpningsmerket med et bestemt navn.

Trinn 2: Legg til overskrifter

Deretter bruker du en hvilken som helst overskriftskode fra "H1" til "H6”For å legge til en overskrift på en HTML -side. For eksempel har vi brukt “H1”For hovedoverskriften og“H2”For den andre overskriften. Du kan også definere inline styling inne i overskriften.

Trinn 3: Lag en annen div container

Etter det, lag en annen div container ved å følge den samme metoden i forrige trinn.

Trinn 4: Opprett en knapp

Legg deretter til en knapp ved hjelp av "”Element. Legg også til en "klasse”Attributt inne i Div åpningsmerket og tilordne to eller flere klassenavn til denne attributtet. “type”Attributt brukes til å spesifisere typen element. Deretter innebygde tekst mellom "knapp”Element som skal vises på knappen:

Linuxhint Ltd UK

Første innhold uten noen endring

Utgangen fra ovennevnte kodeblokk er angitt nedenfor:

Trinn 3: Bruk CSS på “Div” -beholderen

Få tilgang til den andre “div”Container ved hjelp av klassenavnet”.andre-div”:

.andre-div
tekst-align: sentrum;

Etter tilgang til DIV -beholderen, bruk "Tekstalign”Eiendom til CSS som brukes til å sette inn justering av teksten.

Produksjon

Trinn 4: Sett inn jQuery Library

Vi vil legge til jQuery -biblioteket ved å sette inn følgende lenke inne i taggen mellom hodeelementet i HTML -filen:

Trinn 5: Erstatt innerml av DIV

I “”Tag, legg til følgende kode:

I ovennevnte kodebit:

• • Definere “klar()”Funksjon som bare kjøres når Page Document Object Model (DOM) er klar for JavaScript -kode å utføre.
  • Lag en funksjon for knappelementet for å utføre handlingen når brukeren treffer på den.
  • Nå, “& (velger).html ()”Funksjon brukes for å erstatte innerml av div. For å gjøre det, legg til dataene i "()" å erstatte.

Det kan observeres at innermlen til Div er endret når knappen er klikket:

Du har lært om å erstatte innermlen til en div ved hjelp av jQuery.

Konklusjon

For å erstatte Innerhtml til en div ved hjelp av jQuery, setter du først inn en lenke til jQuery -biblioteket i skriptetoden ved hjelp av "src" Egenskap. Og så "html ()”Funksjon brukes som“& (velger).html”. For å gjøre det, “$ (“#Første-div”).html”Brukes i dette scenariet. Denne oppskrivningen forklarte metoden for å erstatte indrehtml til en div container som bruker jQuery.