Jak ponownie załadować div bez ponownego ładowania całej strony w jQuery

Jak Ponownie Zaladowac Div Bez Ponownego Ladowania Calej Strony W Jquery



Podczas tworzenia wielu stron internetowych dla witryny może być wymagana replikacja danych. Na przykład wykorzystanie tych samych danych na innej stronie internetowej po wywołanym zdarzeniu. W takich sytuacjach ponowne załadowanie div bez ponownego ładowania całej strony pomaga w efektywnym zarządzaniu danymi, oszczędzając w ten sposób czas.

Na tym blogu omówimy sposoby ponownego ładowania elementu div bez ponownego ładowania całej strony w JavaScript.

Jak ponownie załadować div bez ponownego ładowania całej strony w jQuery?

dz ” można ponownie załadować bez ponownego ładowania całej strony, używając metody „on()” jQuery w połączeniu z „ Załaduj() ' metoda.







Metoda on() wiąże jeden lub więcej programów obsługi zdarzeń dla elementów, a metoda load() ładuje zawartość do pobranego elementu. Te metody można łączyć, aby uzyskać dostęp do elementu div i ponownie załadować go po wyzwoleniu zdarzenia.



Przykład
Przyjrzyjmy się następującemu kodowi HTML:



< ciało >
< h2 > Oto jak przeładować div bez przeładowywania całej strony h2 >
< identyfikator div = „mój dział” >
< p > JavaScript to język programowania zawierający funkcje , zmienne , zdarzenia i przedmioty itp. p >
dz >
< przycisk > przeładować przycisk >
ciało >

W powyższym bloku kodu:





  • Dołącz podany nagłówek.
  • Określ także element „
    ” mający atrybut „id”.
  • Następnie umieść akapit w tagu „

    ” i przycisk uruchamiający żądaną funkcjonalność.

Przejdźmy teraz do kodu JavaScript:

< źródło skryptu = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' >
scenariusz >
< scenariusz >
$ ( 'przycisk' ) . na ( 'Kliknij' , funkcjonować ( ) {
$ ( '#myDiv' ) . Załaduj ( '#myDiv' )
alarm ( „Przeładowany” )
} ) ;

W tym fragmencie kodu



  • Dołącz bibliotekę jQuery za pomocą „ źródło ' atrybut.
  • Uzyskaj dostęp do utworzonego przycisku i powiąż „ na() ' metoda.
  • Spowoduje to wywołanie wspomnianej funkcji po kliknięciu przycisku, jak wynika z załączonego zdarzenia „ Kliknij ”.
  • W definicji funkcji uzyskaj dostęp do dołączonych „ ” i załaduj go ponownie, używając opcji „ Załaduj() ”, odwołując się do jej „ ID ”.
  • W rezultacie dołączony div zostanie ponownie załadowany po kliknięciu przycisku, a komunikat podany w oknie dialogowym alertu zostanie wyświetlony.

Wynik

Można zauważyć, że div został pomyślnie przeładowany bez przeładowywania całej strony.

Wniosek

Aby ponownie załadować div bez ponownego ładowania całej strony, użyj „ na() ” w połączeniu z metodą „ Załaduj() ' metoda. Metody te można wykorzystać do ponownego załadowania zawartości elementu div po wywołanym zdarzeniu poprzez uzyskanie do niego dostępu i ponowne odwołanie się do niego. W tym blogu opisano metodę ponownego ładowania elementu div bez ponownego ładowania całej strony.