Sådan genindlæses div'en uden at genindlæse hele siden i jQuery

Sadan Genindlaeses Div En Uden At Genindlaese Hele Siden I Jquery



Mens du opretter flere websider for et websted, kan der være et krav om at replikere dataene. For eksempel at bruge de samme data på en anden webside efter den udløste hændelse. I sådanne situationer hjælper genindlæsning af div'en uden at genindlæse hele siden med at administrere dataene effektivt og derved spare tid.

Denne blog vil diskutere tilgange til at genindlæse div uden at genindlæse hele siden i JavaScript.

Sådan genindlæses div'en uden at genindlæse hele siden i jQuery?

Det ' div ' kan genindlæses uden at genindlæse hele siden ved hjælp af jQuerys 'on()'-metode i kombination med ' belastning() ” metode.







On()-metoden knytter en eller flere hændelseshandlere til elementerne, og load()-metoden indlæser indholdet i det hentede element. Disse metoder kan kombineres for at få adgang til div'en og genindlæse den ved den udløste hændelse.



Eksempel
Lad os gennemgå følgende HTML-kode:



< legeme >
< h2 > Sådan genindlæses div uden at genindlæse hele siden h2 >
< div id = 'myDiv' >
< s > JavaScript er et programmeringssprog, som indeholder funktioner , variabler , begivenheder og genstande mv. s >
div >
< knap > genindlæs knap >
legeme >

I ovenstående kodeblok:





  • Medtag den angivne overskrift.
  • Angiv også '
    '-elementet med attributten 'id'.
  • Derefter skal du inkludere afsnittet i '

    '-tagget og en knap for at udløse den ønskede funktionalitet.

Lad os nu gå videre til JavaScript-koden:

< script src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' >
manuskript >
< manuskript >
$ ( 'knap' ) . ( 'klik' , fungere ( ) {
$ ( '#myDiv' ) . belastning ( '#myDiv' )
alert ( 'Genindlæst' )
} ) ;

I dette kodestykke



  • Inkluder jQuery-biblioteket via ' src ' attribut.
  • Få adgang til den oprettede knap og tilknyt ' på() ” metode.
  • Dette vil påkalde den nævnte funktion ved et klik på knappen, som det fremgår af den vedhæftede begivenhed ' klik ”.
  • I funktionsdefinitionen skal du få adgang til den inkluderede '
    ' element og indlæs det igen ved at bruge ' belastning() '-metoden ved at henvise til dens ' id ”.
  • Som følge heraf vil den inkluderede div blive genindlæst igen ved et klik på knappen, og den angivne besked via advarselsdialogboksen vil blive vist.

Produktion

Det kan ses, at div'en er genindlæst uden at genindlæse hele siden.

Konklusion

For at genindlæse div uden at genindlæse hele siden, brug ' på() ' metode i kombination med ' belastning() ” metode. Disse metoder kan bruges til at genindlæse indholdet af div'en efter den udløste hændelse ved at få adgang til den og henvise til den igen. Denne blog beskrev metoden til at genindlæse div uden at genindlæse hele siden.