Rumah > Artikel > hujung hadapan web > Apakah teknologi ajax?
Teknologi yang disertakan dalam ajax ialah: 1. HTML atau XHTML, digunakan untuk mencipta kandungan halaman web; 2. CSS, digunakan untuk mencantikkan kandungan halaman web; 4. XMLHttpRequest, Digunakan untuk komunikasi tak segerak dengan pelayan 5. JavaScript, untuk melaksanakan pengikatan dan panggilan.
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.
Ajax ialah istilah baharu yang dicadangkan oleh Jesse James Garrett pada tahun 2005 untuk menerangkan pendekatan 'baharu' menggunakan koleksi teknologi sedia ada, termasuk: HTML atau XHTML, CSS, JavaScript, DOM, XML, XSLT, dan kebanyakan yang penting XMLHttpRequest.
Menggunakan aplikasi web teknologi Ajax boleh mempersembahkan kemas kini tambahan dengan pantas kepada antara muka pengguna tanpa perlu memuat semula (memuat semula) keseluruhan halaman, yang membolehkan program bertindak balas terhadap operasi pengguna dengan lebih pantas.
Teknologi yang disertakan dalam ajax:
Semua orang tahu bahawa ajax bukanlah teknologi baharu, tetapi gabungan beberapa teknologi asal. Ia terdiri daripada teknologi berikut.
1. HTML atau XHTML, digunakan untuk mencipta kandungan web
2, digunakan untuk mencantikkan kandungan web
3.
4. Gunakan XMLHttpRequest untuk berkomunikasi secara tidak segerak dengan pelayan.
5. Gunakan javascript untuk mengikat dan memanggil.
Antara teknologi di atas, kecuali untuk objek XmlHttpRequest, semua teknologi lain adalah berdasarkan piawaian web dan telah digunakan secara meluas Walaupun XMLHttpRequest masih belum diterima pakai oleh W3C, ia sudah pun menjadi standard A de facto sebagai hampir semua pelayar utama kini menyokongnya.
prinsip ajax dan objek XmlHttpRequest
Prinsip Ajax hanyalah menghantar permintaan tak segerak ke pelayan melalui objek XmlHttpRequest, dapatkan data daripada pelayan, dan kemudian gunakan javascript untuk mengendalikan DOM Dan kemas kini halaman. Langkah paling kritikal ialah mendapatkan data permintaan daripada pelayan. Untuk memahami proses dan prinsip ini, kita mesti memahami sesuatu tentang XMLHttpRequest.
XMLHttpRequest ialah mekanisme teras ajax Ia pertama kali diperkenalkan dalam IE5 dan merupakan teknologi yang menyokong permintaan tak segerak. Ringkasnya, JavaScript boleh membuat permintaan kepada pelayan dan memproses respons tepat pada masanya tanpa menyekat pengguna. Tidak mencapai kesan penyegaran.
Jadi mari kita mulakan dengan XMLHttpRequest dan lihat cara ia berfungsi.
Pertama, mari kita lihat sifat objek XMLHttpRequest.
Atributnya ialah:
onreadystatechange Pengendali acara untuk acara dicetuskan setiap kali keadaan berubah.
responseText mengembalikan bentuk rentetan data daripada proses pelayan.
responseXML Objek data dokumen yang serasi dengan DOM dikembalikan daripada proses pelayan.
status ialah kod berangka yang dikembalikan daripada pelayan, seperti 404 biasa (tidak ditemui) dan 200 (sedia)
maklumat rentetan teks status yang mengiringi kod status
readyState Nilai status Objek
0 (tidak dimulakan) Objek telah dicipta, tetapi belum dimulakan (kaedah terbuka belum dipanggil lagi)
1 (Dimulakan) Objek telah dicipta , tetapi kaedah hantar belum dipanggil lagi
2 (Hantar data) Kaedah hantar telah dipanggil, tetapi status semasa dan pengepala http tidak diketahui
3 (Data sedang dihantar) Sebahagian daripada data telah diterima kerana respons dan pengepala http tidak lengkap Pada masa ini, ia diperoleh melalui responsBody dan responseText Akan terdapat ralat dalam beberapa data
4 (Lengkap) Data diterima. Pada masa ini, data tindak balas yang lengkap boleh diperolehi melalui responseXml dan responseText
Namun, disebabkan perbezaan antara penyemak imbas, Jadi mencipta objek XMLHttpRequest mungkin memerlukan kaedah yang berbeza. Perbezaan ini terutamanya ditunjukkan antara IE dan pelayar lain. Berikut ialah kaedah yang agak standard untuk mencipta objek XMLHttpRequest.
function CreateXmlHttp() { //非IE浏览器创建XmlHttpRequest对象 if(window.XmlHttpRequest) { xmlhttp=new XmlHttpRequest(); } //IE浏览器创建XmlHttpRequest对象 if(window.ActiveXObject) { try { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { try{ xmlhttp=new ActiveXObject("msxml2.XMLHTTP"); } catch(ex){} } } } function TestAjax() { var data=document.getElementByIdx("username").value; CreateXmlHttp(); if(!xmlhttp) { alert("创建xmlhttp对象异常!"); return false; } xmlhttp.open("POST",url,false); xmlhttp.onreadystatechange=function() { if(xmlhttp.readyState==4) { document.getElementByIdx("user1").innerHTML="数据正在加载..."; if(xmlhttp.status==200) { document.write(xmlhttp.responseText); } } } xmlhttp.send(); }
Seperti yang ditunjukkan di atas, fungsi menyemak status keseluruhan XMLHttpRequest dan memastikan ia telah selesai (readyStatus=4), iaitu data telah dihantar. Kemudian tanya status permintaan mengikut tetapan pelayan Jika semuanya sudah sedia (status=200), kemudian lakukan operasi yang diperlukan berikut.
Untuk dua kaedah XmlHttpRequest, buka dan hantar, kaedah buka menentukan:
a.
b. Alamat url yang diminta dan parameter diluluskan.
c. Mod penghantaran, palsu bermaksud segerak, benar bermaksud tak segerak. Lalai adalah benar. Jika ia adalah mod komunikasi tak segerak (benar), pelanggan tidak menunggu respons pelayan jika ia adalah mod segerak (palsu), pelanggan perlu menunggu sehingga pelayan mengembalikan mesej sebelum melakukan operasi lain. Kami perlu menentukan kaedah penyegerakan mengikut keperluan sebenar Dalam sesetengah halaman, berbilang permintaan mungkin dikeluarkan, atau permintaan berintensiti tinggi berskala besar yang disusun, dirancang dan dibentuk, dan permintaan yang terakhir akan menimpa yang sebelumnya. . Ini Sudah tentu, anda mesti menentukan kaedah penyegerakan.
Kaedah hantar digunakan untuk menghantar permintaan.
Mengetahui aliran kerja XMLHttpRequest, kita dapat melihat bahawa XMLHttpRequest digunakan sepenuhnya untuk mengeluarkan permintaan kepada pelayan, dan peranannya terhad kepada ini, tetapi peranannya adalah kunci kepada keseluruhan pelaksanaan ajax, kerana ajax tidak lebih daripada itu. daripada Dua proses, membuat permintaan dan membalas permintaan. Dan ia sepenuhnya teknologi sisi pelanggan. XMLHttpRequest mengendalikan masalah komunikasi antara pelayan dan klien, itulah sebabnya ia sangat penting.
Kini, kita mungkin boleh memahami prinsip ajax. Kita boleh menganggap pelayan sebagai antara muka data, yang mengembalikan aliran teks biasa Sudah tentu, aliran teks ini boleh dalam format XML, Html, kod Javascript atau hanya rentetan. Pada masa ini, XMLHttpRequest meminta halaman ini daripada pelayan, dan pelayan menulis hasil teks ke dalam halaman Ini adalah sama dengan proses pembangunan web biasa. Perbezaannya ialah selepas klien memperoleh hasil secara tidak segerak dipaparkan pada halaman , tetapi diproses oleh javascript terlebih dahulu dan kemudian dipaparkan pada halaman. Bagi banyak kawalan ajax yang popular sekarang, seperti magicajax, dan lain-lain, mereka boleh mengembalikan jenis data lain seperti DataSet Mereka hanya merangkum hasil proses ini, tidak banyak perbezaan di antara mereka.
【Tutorial berkaitan yang disyorkan: Tutorial video AJAX】
Atas ialah kandungan terperinci Apakah teknologi ajax?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!