Bu blog, tüm sayfayı JavaScript'te yeniden yüklemeden div'i yeniden yükleme yaklaşımlarını tartışacaktır.
JQuery'de Tüm Sayfayı Yeniden Yüklemeden div nasıl Yeniden Yüklenir?
“ div ”, jQuery'nin “on()” yöntemi ile birlikte kullanılarak sayfanın tamamı yeniden yüklenmeden yeniden yüklenebilir. yük() ' yöntem.
on() yöntemi, öğeler için bir veya daha fazla olay işleyiciyi ilişkilendirir ve load() yöntemi, içeriği getirilen öğeye yükler. Bu yöntemler, div'e erişmek ve tetiklenen olay üzerine yeniden yüklemek için birleştirilebilir.
Örnek vermek
Aşağıdaki HTML kodunu gözden geçirelim:
< gövde >
< h2 > Bu, tüm sayfayı yeniden yüklemeden div'in nasıl yeniden yükleneceğidir. h2 >
< div kimliği = 'benimDiv' >
< p > JavaScript, işlevleri içeren bir programlama dilidir , değişkenler , olaylar ve nesneler vb. p >
div >
< buton > Tekrar yükle buton >
gövde >
Yukarıdaki kod bloğunda:
- Belirtilen başlığı ekleyin.
- Ayrıca, 'id' özniteliğine sahip '' öğesini belirtin.
- Bundan sonra, istenen işlevi tetiklemek için '
' etiketinin içine paragrafı ve bir düğmeyi ekleyin.
Şimdi JavaScript koduna geçelim:
< komut dosyası kaynağı = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' >
senaryo >
< senaryo >
$ ( 'buton' ) . üzerinde ( 'Tıklayın' , işlev ( ) {
$ ( '#benimDiv' ) . yük ( '#benimDiv' )
uyarmak ( 'Yeniden yüklendi' )
} ) ;Bu kod parçacığında
- jQuery kitaplığını 'aracılığıyla dahil edin. kaynak ' bağlanmak.
- Oluşturulan düğmeye erişin ve “ üzerinde() ' yöntem.
- Bu, ekteki olaydan da anlaşılacağı gibi, düğme tıklandığında belirtilen işlevi çağıracaktır ' Tıklayın ”.
- İşlev tanımında, dahil edilen ' ” öğesini seçin ve “ öğesini kullanarak yeniden yükleyin. yük() ' yöntemine atıfta bulunarak ' İD ”.
- Sonuç olarak, dahil olan div, düğme tıklandığında yeniden yüklenecek ve uyarı diyalog kutusu aracılığıyla belirtilen mesaj görüntülenecektir.
Çıktı
Sayfanın tamamı yeniden yüklenmeden div'in başarıyla yeniden yüklendiği gözlemlenebilir.
Çözüm
Tüm sayfayı yeniden yüklemeden div'i yeniden yüklemek için ' üzerinde() ' yöntemi ' ile birlikte yük() ' yöntem. Bu yöntemler, div içeriğine erişerek ve ona tekrar başvurarak tetiklenen olay üzerine yeniden yüklemek için kullanılabilir. Bu blog, tüm sayfayı yeniden yüklemeden div'i yeniden yükleme yöntemini açıkladı.
- Bundan sonra, istenen işlevi tetiklemek için '