Blog ini akan membincangkan pendekatan untuk memuat semula div tanpa memuat semula keseluruhan halaman dalam JavaScript.
Bagaimana untuk Muat Semula div Tanpa Muat Semula Seluruh Halaman dalam jQuery?
' div ” boleh dimuat semula tanpa memuat semula keseluruhan halaman menggunakan kaedah “on()” jQuery dalam kombinasi dengan “ beban() ” kaedah.
Kaedah on() mengaitkan satu atau lebih pengendali acara untuk elemen dan kaedah load() memuatkan kandungan ke dalam elemen yang diambil. Kaedah ini boleh digabungkan untuk mengakses div dan memuatkannya semula apabila peristiwa yang dicetuskan.
Contoh
Mari kita tinjau kod HTML berikut:
< badan >
< h2 > Beginilah cara memuatkan semula div tanpa memuatkan semula keseluruhan halaman h2 >
< id div = 'myDiv' >
< hlm > JavaScript ialah bahasa pengaturcaraan yang mengandungi fungsi , pembolehubah , peristiwa dan objek dll. hlm >
div >
< butang > Tambah nilai butang >
badan >
Dalam blok kod di atas:
- Sertakan tajuk yang dinyatakan.
- Juga, nyatakan elemen '' yang mempunyai atribut 'id'.
- Selepas itu, masukkan perenggan dalam teg “
” dan butang untuk mencetuskan kefungsian yang diingini.
Sekarang, mari kita beralih kepada kod JavaScript:
< skrip src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' >
skrip >
< skrip >
$ ( 'butang' ) . pada ( 'klik' , fungsi ( ) {
$ ( '#myDiv' ) . memuatkan ( '#myDiv' )
amaran ( 'Dimuat semula' )
} ) ;Dalam coretan kod ini
- Sertakan perpustakaan jQuery melalui ' src ” atribut.
- Akses butang yang dibuat dan kaitkan ' pada() ” kaedah.
- Ini akan menggunakan fungsi yang disebutkan apabila klik butang, seperti yang terbukti dari acara yang dilampirkan ' klik ”.
- Dalam definisi fungsi, akses ' yang disertakan elemen ” dan muatkannya semula menggunakan “ beban() ' kaedah dengan merujuk kepada ' ID ”.
- Akibatnya, div yang disertakan akan dimuatkan semula apabila butang diklik, dan mesej yang dinyatakan melalui kotak dialog amaran akan dipaparkan.
Pengeluaran
Dapat diperhatikan bahawa div berjaya dimuat semula tanpa memuat semula keseluruhan halaman.
Kesimpulan
Untuk memuat semula div tanpa memuat semula keseluruhan halaman, gunakan ' pada() kaedah ' dalam kombinasi dengan ' beban() ” kaedah. Kaedah ini boleh digunakan untuk memuatkan semula kandungan div apabila peristiwa yang dicetuskan dengan mengaksesnya dan merujuknya semula. Blog ini menerangkan kaedah untuk memuat semula div tanpa memuat semula keseluruhan halaman.
- Selepas itu, masukkan perenggan dalam teg “