Dalam "Manual Rujukan Cina AJAX", AJAX bukanlah bahasa pengaturcaraan baharu, tetapi kaedah baharu menggunakan piawaian sedia ada. AJAX ialah seni menukar data dengan pelayan dan mengemas kini bahagian halaman web tanpa memuatkan semula keseluruhan halaman.
AJAX adalah singkatan dari "Asynchronous JavaScript and XML" (asynchronous JavaScript and XML technology), yang merujuk kepada satu set teknologi pembangunan web sebelah penyemak imbas yang menggabungkan berbilang teknologi. Konsep Ajax dicadangkan oleh Jesse James Jarrett.
Aplikasi web tradisional membolehkan pengguna mengisi borang, dan apabila borang diserahkan, permintaan dihantar ke pelayan web. Pelayan menerima dan memproses borang masuk, dan kemudian menghantar semula halaman web baharu, tetapi ini membazirkan banyak lebar jalur kerana kebanyakan kod HTML dalam dua halaman selalunya sama. Memandangkan setiap komunikasi aplikasi memerlukan penghantaran permintaan kepada pelayan, masa respons aplikasi bergantung pada masa respons pelayan. Ini menghasilkan UI yang lebih perlahan untuk bertindak balas daripada apl asli.
Berbeza daripada ini, aplikasi AJAX hanya boleh menghantar dan mendapatkan semula data yang diperlukan kepada pelayan, dan menggunakan JavaScript pada klien untuk memproses respons daripada pelayan. Oleh kerana kurang data yang ditukar antara pelayan dan penyemak imbas, pelayan bertindak balas dengan lebih pantas. Pada masa yang sama, banyak kerja pemprosesan boleh diselesaikan pada mesin klien yang membuat permintaan, jadi beban pada pelayan Web juga dikurangkan.
Petua: Sebelum anda mula belajar AJAX, anda harus mempunyai pemahaman asas tentang HTML, CSS, javascript.
Serupa dengan DHTML atau LAMP, AJAX tidak merujuk kepada satu teknologi, tetapi secara organik menggunakan satu siri teknologi yang berkaitan. Walaupun namanya mengandungi XML, format data sebenarnya boleh digantikan dengan JSON, seterusnya mengurangkan jumlah data, membentuk apa yang dipanggil AJAJ. Pelanggan dan pelayan tidak perlu tidak segerak.
Penggunaan awal AJAX
Instance
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tryrun 1</title>
</head>
<body>
<div id="view">
<p>点击下面的按钮，将 Ajax 请求回来的数据更新在该文本内</p>
</div>
<button type="button" id="btn">发起 Ajax 请求</button>
<script>
document.getElementById("btn").onclick = ajaxRequest;
function ajaxRequest () {
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://www.php.cn/statics/demosource/ajax_info.txt", true);
xhr.send();
xhr.onreadystatechange = function(){
if (xhr.readyState === 4 && xhr.status === 200) {
document.getElementById("view").innerHTML = xhr.responseText;
}
}
}
</script>
</body>Running instance »
Klik butang "Run Instance" untuk melihat instance dalam talian
Petua: Tutorial AJAX kami akan membantu anda mempelajari cara menguasai dan menggunakan AJAX langkah demi langkah Jika anda mempunyai sebarang soalan, sila pergi ke laman web PHP Cina Komuniti AJAX untuk bertanya soalan anda, dan netizen yang bersemangat akan menjawab. mereka untuk anda.
AJAX Kelebihan dan Kekurangan
Kelebihan terbesar menggunakan Ajax ialah ia boleh mengekalkan data tanpa mengemas kini keseluruhan halaman. Ini membolehkan aplikasi web bertindak balas dengan lebih cepat kepada tindakan pengguna dan mengelakkan penghantaran maklumat yang tidak berubah melalui rangkaian.
Ajax tidak memerlukan sebarang pemalam penyemak imbas, tetapi memerlukan pengguna membenarkan JavaScript untuk melaksanakan pada penyemak imbas. Sama seperti aplikasi DHTML, aplikasi Ajax mesti diuji dengan teliti pada banyak pelayar dan platform yang berbeza. Apabila Ajax matang, beberapa perpustakaan program yang memudahkan penggunaan Ajax juga telah keluar. Begitu juga, satu lagi teknologi pengaturcaraan bantuan telah muncul untuk menyediakan fungsi alternatif untuk pengguna yang tidak menyokong JavaScript.
Kritikan utama menggunakan Ajax ialah ia boleh mematahkan bahagian belakang pelayar dan fungsi penanda halaman. Dalam kes halaman yang dikemas kini secara dinamik, pengguna tidak boleh kembali ke keadaan halaman sebelumnya kerana penyemak imbas hanya boleh mengingati halaman statik dalam sejarah. Perbezaan yang mungkin antara halaman yang telah dibaca sepenuhnya dan halaman yang telah diubah suai secara dinamik adalah sangat halus pengguna sering mengharapkan untuk mengklik butang belakang untuk membatalkan operasi mereka sebelum ini, tetapi dalam aplikasi Ajax, ini tidak berlaku untuk berbuat demikian. Walau bagaimanapun, pembangun telah menghasilkan pelbagai cara untuk menyelesaikan masalah ini Kebanyakan kaedah sebelum HTML5 adalah untuk mencipta atau menggunakan IFRAME tersembunyi untuk menghasilkan semula perubahan pada halaman apabila pengguna mengklik butang belakang untuk mengakses sejarah. (Sebagai contoh, apabila pengguna mengklik semula dalam Peta Google, ia mencari dalam IFRAME tersembunyi dan kemudian mencerminkan hasil carian pada elemen Ajax untuk memulihkan keadaan aplikasi kepada keadaan pada masa itu).
Berkenaan isu tidak dapat menambah status pada kegemaran atau penanda halaman, satu cara sebelum HTML5 ialah menggunakan pengecam serpihan URL (sering dipanggil sauh, bahagian selepas # dalam URL) untuk menjejak dan membenarkan pengguna untuk kembali ke keadaan aplikasi tertentu. (Banyak penyemak imbas membenarkan JavaScript mengemas kini sauh secara dinamik, yang membolehkan aplikasi Ajax mengemas kini sauh semasa mengemas kini kandungan yang dipaparkan.) HTML5 kemudiannya akan dapat memanipulasi sejarah penyemakan imbas secara langsung, menyimpan status halaman web sebagai rentetan dan menambah halaman web pada kegemaran web . Apabila keratan atau penanda halaman, keadaan dikekalkan secara tidak kelihatan. Kedua-dua kaedah di atas juga boleh menyelesaikan masalah tidak boleh berundur pada masa yang sama.
Apabila membangunkan Ajax, kependaman rangkaian—iaitu, selang antara pengguna yang membuat permintaan dan pelayan yang menghantar respons—perlu dipertimbangkan dengan teliti. Tidak memberikan respons yang jelas kepada pengguna, data prabacaan yang tidak betul, atau pengendalian XMLHttpRequest yang tidak betul akan membuatkan pengguna berasa bosan. Penyelesaian biasa ialah menggunakan komponen visual untuk memberitahu pengguna bahawa sistem sedang menjalankan operasi latar belakang dan membaca data dan kandungan.
Aplikasi
Gunakan XHTML+CSS untuk menyatakan maklumat;
Gunakan JavaScript untuk mengendalikan DOM (Document Object Model) untuk menjalankan kesan dinamik
- ;
-
Gunakan XMLHttpRequest atau API Ambil yang baharu melakukan pertukaran data tak segerak dengan pelayan web
Nota: AJAX berbeza daripada teknologi RIA seperti Flash, Silverlight dan Java Applet.
Apa yang diliputi oleh manual tutorial AJAX ini
Manual tutorial AJAX ini merangkumi semua kaedah penggunaan asas AJAX, termasuk bermula dengan AJAX, pengenalan kepada AJAX, contoh AJAX, objek penciptaan XHR, permintaan XHR, respons XHR, XHR readyState, AJAX ASP/PHP , pangkalan data AJAX, AJAX XML dan pengetahuan lain.
Petua: Setiap bab tutorial ini mengandungi banyak contoh AJAX Anda boleh terus klik butang "Jalankan Contoh" untuk melihat keputusan dalam talian. Contoh-contoh ini akan membantu anda memahami dan menggunakan AJAX dengan lebih baik.
Bab terbaru
- AJAX 实例 2016-10-19
- AJAX XML 2016-10-19
- AJAX 数据库 2016-10-19
- AJAX ASP/PHP 2016-10-19
- XHR readystate 2016-10-19
- XHR 响应 2016-10-19
- XHR 请求 2016-10-19
- XHR 创建对象 2016-10-19
Kursus berkaitan
- Pengenalan pantas kepada pembangunan bahagian hadapan web 2021-12-10
- Kursus bahagian hadapan yang paling memahami anda: HTML5/CSS3/ES6/NPM/Vue/...[Asal] 2022-09-30
- Tutorial Video Permulaan Gulp 2022-04-18
- Tutorial video Brothers in Arms Gao Luofeng CSS3 2022-04-20
- Aplikasi web pembangunan AngularJS contoh tutorial video asas 2022-04-18
- Kenalan penuh Ajax 2022-04-13
- Tutorial video asas rangka kerja MUI 2022-04-13
- Kelas percubaan kelas latihan dalam talian 2019-01-10