Rumah hujung hadapan web tutorial js 2 cara untuk mendapatkan data json secara tidak segerak dengan jQuery_jquery

2 cara untuk mendapatkan data json secara tidak segerak dengan jQuery_jquery

May 16, 2016 pm 04:38 PM
jquery data json tak segerak Cara dapatkan

Contoh dalam artikel ini menerangkan dua cara untuk jQuery mendapatkan data json secara tidak segerak, yang mempunyai nilai praktikal yang hebat dalam pembangunan program web. Kongsikan dengan semua orang untuk rujukan anda. Kaedah khusus adalah seperti berikut:

Secara umumnya, terdapat dua cara untuk jQuery mendapatkan data json secara tidak segerak, satu ialah kaedah $.getJSON dan satu lagi ialah kaedah $.ajax. Artikel ini akan menggunakan dua kaedah ini untuk mendapatkan data json secara tidak segerak dan kemudian menambahkannya pada halaman.

Buat fail data.json dalam direktori akar:

1

2

3

4

{

  "one" : "Hello",

  "two" : "World"

}

Salin selepas log masuk

1. Dapatkan data json melalui kaedah $.getJSON

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<script src="Scripts/jquery-2.1.1.min.js"></script>

<script type="text/javascript">

  $(function() {

    $.getJSON('data.json', function(data) {

      var items = [];

      $.each(data, function(key, val) {

        items.push('<li id="' + key + '">' + val + '</li>');

      });

      $('<ul/>', {

        'class': 'list',

        html: items.join('')

      }).appendTo('body');

    });

  });

</script>

Salin selepas log masuk

2. Dapatkan data json melalui kaedah $.ajax

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

<script src="Scripts/jquery-2.1.1.min.js"></script>

<script type="text/javascript">

  $(function() {

    $.ajax({

      url: 'data.json',

      dataType: 'json',

      success: function(data) {

        var items = [];

        $.each(data, function(key, val) {

          items.push('<li id="' + key + '">' + val + '</li>');

        });

        $('<ul/>', {

          'class': 'list',

          html: items.join('')

        }).appendTo('body');

      },

      statusCode: {

        404: function() {

          alert("没有找到相关文件~~");

        }

      }

    });

  });

</script>

Salin selepas log masuk

Ringkasan: Menggunakan kaedah $.getJSON dan kaedah $.ajax boleh mencapai kesan yang sama Walau bagaimanapun, jika anda ingin mempunyai kawalan yang lebih terperinci ke atas proses pemerolehan tak segerak, adalah disyorkan untuk menggunakan $. kaedah ajax.

Saya percaya bahawa apa yang diterangkan dalam artikel ini mempunyai nilai rujukan tertentu untuk pengaturcaraan jQuery semua orang.

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Repo: Cara menghidupkan semula rakan sepasukan
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Cara mendapatkan biji gergasi
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Di mana untuk mendapatkan kod keselamatan Google Di mana untuk mendapatkan kod keselamatan Google Mar 30, 2024 am 11:11 AM

Google Authenticator ialah alat yang digunakan untuk melindungi keselamatan akaun pengguna dan kuncinya ialah maklumat penting yang digunakan untuk menjana kod pengesahan dinamik. Jika anda terlupa kunci Google Authenticator dan hanya boleh mengesahkannya melalui kod keselamatan, maka editor tapak web ini akan membawakan anda pengenalan terperinci tentang tempat untuk mendapatkan kod keselamatan Google. Saya harap ia dapat membantu anda tahu lebih lanjut Pengguna sila teruskan membaca di bawah! Mula-mula buka tetapan telefon dan masukkan halaman tetapan. Tatal ke bawah halaman dan cari Google. Pergi ke halaman Google dan klik pada Akaun Google. Masukkan halaman akaun dan klik Lihat di bawah kod pengesahan. Masukkan kata laluan anda atau gunakan cap jari anda untuk mengesahkan identiti anda. Dapatkan kod keselamatan Google dan gunakan kod keselamatan untuk mengesahkan identiti Google anda.

Bagaimana untuk menggunakan kaedah permintaan PUT dalam jQuery? Bagaimana untuk menggunakan kaedah permintaan PUT dalam jQuery? Feb 28, 2024 pm 03:12 PM

Bagaimana untuk menggunakan kaedah permintaan PUT dalam jQuery? Dalam jQuery, kaedah menghantar permintaan PUT adalah serupa dengan menghantar jenis permintaan lain, tetapi anda perlu memberi perhatian kepada beberapa butiran dan tetapan parameter. Permintaan PUT biasanya digunakan untuk mengemas kini sumber, seperti mengemas kini data dalam pangkalan data atau mengemas kini fail pada pelayan. Berikut ialah contoh kod khusus menggunakan kaedah permintaan PUT dalam jQuery. Mula-mula, pastikan anda memasukkan fail perpustakaan jQuery, kemudian anda boleh menghantar permintaan PUT melalui: $.ajax({u

Bagaimana untuk memasang dua kad SIM pada Realme 12 Pro? Bagaimana untuk memasang dua kad SIM pada Realme 12 Pro? Mar 18, 2024 pm 02:10 PM

Walaupun operasi umum telefon mudah alih domestik sangat serupa, masih terdapat beberapa perbezaan dalam beberapa butiran Sebagai contoh, model dan pengeluar telefon mudah alih yang berbeza mungkin mempunyai kaedah pemasangan dwi-SIM yang berbeza. Telefon baharu Erzhenwo 12Pro juga menyokong dwi-SIM siap sedia, tetapi bagaimanakah dwi-SIM perlu dipasang pada telefon ini? Bagaimana untuk memasang dwi SIM pada Realme 12Pro? Ingat untuk mematikan telefon anda sebelum pemasangan. Langkah 1: Cari dulang kad SIM: Cari dulang kad SIM telefon Biasanya, dalam Realme 12 Pro, dulang kad SIM terletak di bahagian tepi atau atas telefon. Langkah 2: Masukkan kad SIM pertama Gunakan pin kad SIM khusus atau objek kecil untuk memasukkannya ke dalam slot dalam dulang kad SIM Kemudian, masukkan kad SIM pertama dengan teliti.

Petua jQuery: Cepat ubah suai teks semua teg pada halaman Petua jQuery: Cepat ubah suai teks semua teg pada halaman Feb 28, 2024 pm 09:06 PM

Tajuk: Petua jQuery: Cepat ubah suai teks semua teg pada halaman Dalam pembangunan web, kita selalunya perlu mengubah suai dan mengendalikan elemen pada halaman. Apabila menggunakan jQuery, kadangkala anda perlu mengubah suai kandungan teks semua teg dalam halaman sekaligus, yang boleh menjimatkan masa dan tenaga. Berikut akan memperkenalkan cara menggunakan jQuery untuk mengubah suai teks semua teg pada halaman dengan cepat, dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan fail perpustakaan jQuery dan memastikan bahawa kod berikut dimasukkan ke dalam halaman: &lt

Gunakan jQuery untuk mengubah suai kandungan teks semua teg Gunakan jQuery untuk mengubah suai kandungan teks semua teg Feb 28, 2024 pm 05:42 PM

Tajuk: Gunakan jQuery untuk mengubah suai kandungan teks semua teg jQuery ialah perpustakaan JavaScript yang popular yang digunakan secara meluas untuk mengendalikan operasi DOM. Dalam pembangunan web, kita sering menghadapi keperluan untuk mengubah suai kandungan teks tag pautan (tag) pada halaman. Artikel ini akan menerangkan cara menggunakan jQuery untuk mencapai matlamat ini dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan perpustakaan jQuery ke dalam halaman. Tambahkan kod berikut dalam fail HTML:

Panduan Lanjutan untuk Python asyncio: Dari Pemula kepada Pakar Panduan Lanjutan untuk Python asyncio: Dari Pemula kepada Pakar Mar 04, 2024 am 09:43 AM

Pengaturcaraan Serentak dan Tak Segerak Pengaturcaraan serentak berurusan dengan berbilang tugas yang dilaksanakan secara serentak, pengaturcaraan tak segerak ialah sejenis pengaturcaraan serentak di mana tugasan tidak menyekat benang. asyncio ialah perpustakaan untuk pengaturcaraan tak segerak dalam python, yang membolehkan atur cara melaksanakan operasi I/O tanpa menyekat utas utama. Gelung peristiwa Teras asyncio ialah gelung peristiwa, yang memantau peristiwa I/O dan menjadualkan tugas yang sepadan. Apabila coroutine sedia, gelung acara melaksanakannya sehingga ia menunggu operasi I/O. Ia kemudian menjeda coroutine dan terus melaksanakan coroutine lain. Coroutines Coroutines ialah fungsi yang boleh menjeda dan menyambung semula pelaksanaan. Kata kunci asyncdef digunakan untuk membuat coroutine. Coroutine menggunakan kata kunci tunggu untuk menunggu operasi I/O selesai. Asas asyncio berikut

Bagaimana untuk mendapatkan Huang Rong dalam permainan mudah alih Shooting Condor Bagaimana untuk mendapatkan Huang Rong dalam permainan mudah alih Shooting Condor Mar 27, 2024 pm 10:36 PM

Permainan Mudah Alih Condor akan dilancarkan secara rasmi Ramai pemain ingin mengetahui cara mendapatkan Huang Rong Pemain mesti memuat turun APP [NetEase Master] dahulu, kemudian menyertai [Condor Circle] dan menyertai Permainan Condor: SSR Huang Rong. akan diberikan secara percuma. Cara mendapatkan Huang Rong dalam permainan mudah alih Condor Shooting 1. Mula-mula, muat turun APP [NetEase Master], dan kemudian sertai [Condor Shooting Circle]. 2. Pergi ke Condor Shooting Circle, luncurkan ke atas halaman untuk memaparkan halaman seperti yang ditunjukkan di bawah, dan klik [Carving Treasure]. 3. Anda juga boleh klik pada [Main Permainan Mini Diaobao: SSR Huang Rong secara Percuma] seperti yang ditunjukkan oleh anak panah dalam gambar di bawah. 4. Kemudian masukkan halaman Diaobao dan klik [Yunyou Zhongdu] di bahagian bawah Ini ialah peranti terbiar. Hanya pilih masa dan arah. 5. Berkeliling sekurang-kurangnya enam kali, memilih masa dan arah yang berbeza setiap kali. 6. Klik untuk menuntut

Bagaimana untuk mendapatkan masa sembang percuma di Taqu Bagaimana untuk mendapatkan masa sembang percuma di Taqu Bagaimana untuk mendapatkan masa sembang percuma di Taqu Bagaimana untuk mendapatkan masa sembang percuma di Taqu Mar 12, 2024 pm 03:58 PM

Bagaimana untuk mendapatkan masa sembang percuma di Taqu? Taqu ialah perisian sembang dan temu janji yang sangat mudah digunakan yang telah membantu ramai rakan bujang mencari pasangan ideal mereka. Dalam perisian ini, kita boleh dengan mudah berbual dengan ramai netizen dan mencari yang paling sesuai dengan jiwa kita. Walau bagaimanapun, baru-baru ini beberapa pengguna mendapati bahawa sembang percuma mereka telah kehabisan apabila menggunakan perisian tersebut. Jadi, bagaimana untuk menyelesaikannya? Editor telah membawakan anda cara untuk mendapatkan masa sembang percuma Rakan-rakan yang berminat harus melihat. Bagaimana untuk mendapatkan masa sembang percuma dengan Taqu: Pertama, buka Taqu pada telefon anda Kemudian klik pada avatar di laman utama peribadi Kemudian klik pada "Berkawan" di bawah Setiap daripada mereka adalah

See all articles