原生AJAX

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    用戶名:<input type='text' id='text1' />
    <input type='button' id='btn' value='點(diǎn)擊注冊(cè)' />
    <script>
        /*
            數(shù)據(jù)請(qǐng)求的過(guò)程
                    1. 瀏覽器的AJAX引擎(XMLHttpRequest) 向服務(wù)器發(fā)起請(qǐng)求 
                    2. 服務(wù)器查詢數(shù)據(jù)庫(kù)
                    3. 數(shù)據(jù)庫(kù)對(duì)數(shù)據(jù)進(jìn)行處理,響應(yīng)給瀏覽器的AJAX 引擎
                    4. AJAX 引擎觸發(fā)回調(diào)函數(shù),更新web界面
            數(shù)據(jù)交互:從瀏覽器到服務(wù)器 ,再?gòu)姆?wù)器到瀏覽器

            ajax 的交互模型
                    1. XMLHttpRequest 電話               創(chuàng)建ajxa對(duì)象
                    2. open           輸入電話號(hào)碼        填寫地址

                            3個(gè)參數(shù)
                            A. 請(qǐng)求的方式(get,post)
                            B. url     user是一個(gè)字段,就是后端給你的請(qǐng)求的字段,接口
                                                $username = $_GET['user']  -----php
                                        一般拿到數(shù)據(jù)需要想的三件事
                                                1. 數(shù)據(jù)長(zhǎng)得什么樣
                                                2. 字段都什么意思
                                                3. 返回的結(jié)果是什么樣的

                            C. 是否異步

                    3. send()         呼叫按鈕的按下      發(fā)送請(qǐng)求
                    4. onload         通話成功            等待
                    5. ajax.responseText                 收到 請(qǐng)求
                                        喂?

        
        */
        let btn = document.getElementById("btn");
        let text = document.getElementById("text1");

        btn.onclick = function () {
            let ajax = new XMLHttpRequest () ; // 
            ajax.open('get','php/get.php?user='+text.value,true);
            ajax.send();
            ajax.onload = function () {
                console.log(ajax.responseText)
            }
        }
    </script>
</body>
</html>

sad
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容