Acest blog va discuta abordările de a reîncărca div-ul fără a reîncărca întreaga pagină în JavaScript.
Cum să reîncărcați div-ul fără a reîncărca întreaga pagină în jQuery?
„ div ” poate fi reîncărcat fără a reîncărca întreaga pagină folosind metoda jQuery „on()” în combinație cu „ sarcină() ” metoda.
Metoda on() asociază unul sau mai mulți handleri de evenimente pentru elemente, iar metoda load() încarcă conținutul în elementul preluat. Aceste metode pot fi combinate pentru a accesa div-ul și a-l reîncărca la evenimentul declanșat.
Exemplu
Să trecem în revistă următorul cod HTML:
< corp >
< h2 > Acesta este cum să reîncărcați div-ul fără a reîncărca întreaga pagină h2 >
< div id = 'myDiv' >
< p > JavaScript este un limbaj de programare care conține funcții , variabile , evenimente și obiecte etc. p >
div >
< buton > reîncărcați buton >
corp >
În blocul de cod de mai sus:
- Includeți titlul menționat.
- De asemenea, specificați elementul „” având atributul „id”.
- După aceea, includeți paragraful în eticheta „
” și un buton pentru a declanșa funcționalitatea dorită.
Acum, să trecem la codul JavaScript:
< script src = „https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js” >
scenariu >
< scenariu >
$ ( 'buton' ) . pe ( 'clic' , funcţie ( ) {
$ ( „#myDiv” ) . sarcină ( „#myDiv” )
alerta ( „Reîncărcat” )
} ) ;În acest fragment de cod
- Includeți biblioteca jQuery prin intermediul „ src ” atribut.
- Accesați butonul creat și asociați „ pe() ” metoda.
- Acest lucru va invoca funcția menționată la clic pe butonul, așa cum este evident din evenimentul atașat „ clic ”.
- În definiția funcției, accesați „ ” și încărcați-l din nou folosind „ sarcină() ” metoda prin referire la „ id ”.
- În consecință, div-ul inclus va fi reîncărcat la clic pe butonul și va fi afișat mesajul declarat prin caseta de dialog de alertă.
Ieșire
Se poate observa că div-ul este reîncărcat cu succes fără a reîncărca întreaga pagină.
Concluzie
Pentru a reîncărca div-ul fără a reîncărca întreaga pagină, utilizați „ pe() ” în combinație cu metoda ” sarcină() ” metoda. Aceste metode pot fi utilizate pentru a reîncărca conținutul div-ului la evenimentul declanșat, accesându-l și referindu-se la el din nou. Acest blog a descris metoda de reîncărcare a div-ului fără a reîncărca întreaga pagină.
- După aceea, includeți paragraful în eticheta „