Pengenalan kepada AJAX

Sebelum mempelajari ajax, mari kita bincangkan dahulu soalan - apakah itu Web 2.0. Apabila anda mendengar istilah Web 2.0, anda harus terlebih dahulu bertanya "Apakah Web 1.0 Walaupun jarang mendengar orang menyebut Web 1.0, ia sebenarnya merujuk kepada Web tradisional dengan model permintaan dan tindak balas yang berbeza sama sekali. Contohnya, pergi ke tapak web hdu.edu.cn dan klik butang. Permintaan dihantar ke pelayan, dan respons dikembalikan kepada penyemak imbas. Permintaan itu bukan sekadar senarai kandungan dan item baharu, tetapi satu lagi halaman HTML yang lengkap. Oleh itu, anda mungkin melihat kelipan atau kegelisahan apabila penyemak imbas web melukis semula halaman dengan HTML baharu. Malah, permintaan dan respons boleh dilihat dengan jelas dengan setiap halaman baharu yang anda lihat.

Web 2.0 (sebahagian besarnya) menghapuskan interaksi bolak-balik yang boleh dilihat ini. Pada Peta Google, sebagai contoh, anda boleh menyeret peta untuk mengezum masuk dan keluar dengan lukisan semula yang minimum. Sudah tentu masih ada permintaan dan maklum balas, tetapi ia tersembunyi di sebalik tabir. Sebagai pengguna, pengalaman lebih selesa dan terasa seperti aplikasi desktop. Perasaan dan paradigma baharu ini ialah apa yang anda dapat apabila seseorang menyebut Web 2.0.

Apa yang perlu dibimbangkan ialah cara menjadikan interaksi baharu ini mungkin. Jelas sekali, anda masih perlu membuat permintaan dan menerima respons, tetapi lukisan semula HTML untuk setiap interaksi permintaan/tindak balas yang menimbulkan perasaan interaksi web yang perlahan dan kikuk. Jadi jelas bahawa kita memerlukan cara untuk membuat permintaan dihantar dan respons yang diterima hanya mengandungi data yang diperlukan dan bukannya keseluruhan halaman HTML. Satu-satunya masa yang anda perlukan untuk mendapatkan keseluruhan halaman HTML baharu ialah apabila anda mahu pengguna melihat halaman baharu.

Tetapi kebanyakan interaksi menambah butiran pada halaman sedia ada, mengubah suai teks utama atau menulis ganti data asal. Dalam kes ini, kaedah Ajax dan Web 2.0 membenarkan data dihantar dan diterima tanpa mengemas kini keseluruhan halaman HTML. Bagi mereka yang menghabiskan banyak masa dalam talian, keupayaan ini boleh menjadikan aplikasi anda berasa lebih pantas dan lebih responsif, memastikan mereka kembali ke tapak anda dari semasa ke semasa.

Apakah itu Ajax?

1 Nama penuh: Asynchronous, JavaScript, And, XML (asynchronous JavaScript and XML)<. 🎜>

2.

3

XHTML dan CSS
Gunakan Model DocumentObject untuk paparan dan interaksi dinamik
Gunakan XML dan XSLT untuk interaksi dan operasi data
Gunakan XMLHttpRequest untuk penerimaan data tak segerak
Gunakan JavaScript untuk mengikatnya Tetapkan bersama

4. Penjelasan: ialah kaedah pembangunan aplikasi Web yang menggunakan skrip sebelah klien untuk bertukar-tukar data dengan pelayan Web. Dengan cara ini, halaman Web boleh dikemas kini secara dinamik tanpa mengganggu proses interaksi dan mengeditnya semula. Menggunakan Ajax, anda boleh mencipta antara muka pengguna Web yang langsung, sangat tersedia, lebih kaya dan lebih dinamik yang dekat dengan aplikasi desktop asli.

Kelebihan utama Ajax adalah seperti berikut:

1. Tiada sokongan pemalam diperlukan (pelayar umum dan JavaScript didayakan secara lalai); >

Kekurangan Ajax adalah seperti berikut:

1. Versi penyemak imbas yang berbeza mempunyai sokongan yang tidak mencukupi untuk objek XMLHttpRequest (seperti sebelum IE5

4. Kekurangan alat pembangunan dan penyahpepijatan (berbanding dengan set alat bahasa lain, penyahpepijatan dan pembangunan JS atau Ajax amat menyedihkan).

Pembangunan program Web biasa kami pada asasnya adalah segerak, yang bermaksud bahawa satu program boleh dilaksanakan sebelum yang seterusnya boleh dilaksanakan Ia serupa dengan panggilan pada telefon panggilan boleh dijawab secara tidak segerak, berbilang panggilan boleh dilaksanakan pada masa yang sama Rasanya terdapat berbilang baris untuk setiap tugas, sama seperti mesej teks anda tidak akan berhenti menerima mesej teks lain hanya kerana anda membaca satu mesej teks. Ajax juga boleh dilaksanakan dalam mod segerak, tetapi mod segerak ialah mod menyekat, yang akan menyebabkan beberapa baris dilaksanakan satu demi satu, yang akan menyebabkan halaman Web muncul dalam keadaan animasi yang digantung Ajax menggunakan mod tak segerak.

Google Suggest

Pada tahun 2005, Google menjadikan AJAX popular dengan Google Suggestnya.

Google Suggest menggunakan AJAX untuk mencipta antara muka web yang sangat dinamik: apabila anda memasukkan kata kunci dalam kotak carian Google, JavaScript akan menghantar aksara ini ke pelayan, dan kemudian pelayan akan mengembalikan senarai cadangan carian .

Contoh paparan:

Mula-mula buat fail html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>php中文网(php.cn)</title>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        function checkname(){
            if($('#name').val() == ""){
                $('#msg').html("please enter the name!");
                $('#name').focus;
                return false;
            }
            if($('#address').val() == ""){
                $('#msg').html("please enter the address!");
                $('#address').focus;
                return false;
            }
            ajax_post();
        }
        function ajax_post(){
            $.post("txt.php",{name:$('#name').val(),address:$('#address').val()}, //url链接txt.php
                    function(data){
                        //$('#msg').html("please enter the name!");
                        //alert(data);
                        $('#msg').html(data);
                    },
                    "text");
        }
    </script>
</head>
<body>
    <form id="ajaxform" name="ajaxform" method="post" action="txt.php">
        <p>
            姓名：<input type="text" name="name" id="name"/>
        </p>
        <p>
            地址：<input type="text" name="address" id="address"/>
        </p>
        <p id="msg"></p>
        <p>
            <input name="Submit" type="button" value="submit" onclick="return checkname()"/>
        </p>
    </form>
</body>
</html>

Buat fail txt.php :

<?php
    $name = $_POST["name"];
    $address = $_POST["address"];
    echo $name."<br>";
    echo $address."<br>";
?>