CodeGym/Java Course/Modul 3/Jaringan dengan jQuery

Jaringan dengan jQuery

Level 7, Pelajaran 8
Tersedia

9.1 $ objek dan metode ajax di jQuery

jQuery juga memiliki objek global khusus untuk bekerja dengan jaringan. Seperti yang bisa Anda tebak, ini disebut $. Ya, itulah namanya. Tapi itu sederhana dan nyaman.

Katakanlah Anda ingin mengirim permintaan ke API di JavaScript Anda dan memproses tanggapan yang diterima. Ini bisa dilakukan seperti ini:

$.ajax({
  type: "POST",
  url: "api.codegym.cc",
  data: {name: 'Bill', location: 'Radmond'},
  success: function(msg){
    alert( "Person found: " + msg );
  }
});

Itu saja, itu saja kodenya. $Kami memanggil metode pada objek ajax(), di mana kami meneruskan objek yang menjelaskan semua yang kami butuhkan: permintaan dan respons.

  • Bidang typemenentukan jenis permintaan HTTP: GETatauPOST
  • Bidang urlmenentukan urlke mana permintaan akan dikirim.
  • Bidang datamenentukan data permintaan dalam format JSON
  • Bidang sukses menentukan fungsi yang akan dipanggil setelah respons sukses dari server.

9.2 Permintaan yang berguna

Tetapi jika Anda tidak perlu mentransfer data apa pun, permintaan dapat ditulis lebih singkat. Misalnya, Anda dapat menulis permintaan POST sederhana seperti ini :

$.post("ajax/test.html", function( data ) {
  $( ".result" ).html( data );
});

Apakah Anda tahu apa yang dilakukan kode $( ".result" ).html( data );? Ayo coba tebak...

Ia menemukan elemen dengan kelas hasil dalam dokumen, dan menambahkan kode HTML di dalamnya - data data. Jadi dalam beberapa baris Anda dapat mengunduh data dari server dan menambahkannya ke halaman Anda. Nah, bukankah itu suatu keindahan? :)

Permintaan GET juga dapat ditulis dalam beberapa baris:

$.get("ajax/test.html"., function( data ) {
  $( ".result" ).html( data );
});

Apakah Anda ingin mengunduh dan menjalankan skrip?

$.ajax({
  method: "GET",
  url: "test.js",
  dataType: "script"
});

Dapatkan halaman HTML terbaru?

$.ajax({
  url: "test.html",
  cache: false
})
  .done(function( html ) {
    $( "#results" ).append( html );
  });

Ada beberapa dokumentasi jQuery yang sangat bagus di internet:

API jQuery

jQuery.ajax()

Selain itu, semua pertanyaan umum mudah dicari di Google dan ada di StackOverflow.

Komentar
  • Populer
  • Baru
  • Lama
Anda harus login untuk memberikan komentar
Halaman ini belum memiliki komentar