国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

原生javaScript實現Ajax 和 jQuery實現Ajax

ssshooter / 3257人閱讀

摘要:作者后臺使用的是語言,所以這里以后臺為例子不影響學習一原生使用方法創建對象兼容處理處理低版本不兼容問題準備發送請求方式接口參數名參數值異步執行發送回調是表示數據解析完成,后臺處理完成了。是表示處理的結果是的。

作者后臺使用的是php語言,所以這里以php后臺Api為例子,不影響學習Ajax
一、 javaScript原生使用Ajax 1.get方法
//1.創建對象 兼容處理
var xhr = null;
//處理低版本IE不兼容問題
if(window.XMLHttpRequest){
    xhr = new XMLHttpRequest();
}else{
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
//2.準備發送 請求方式  接口    參數名    參數值        異步
xhr.open("get","xxx.php?username=" + usernameValue ,true);
//3.執行發送
xhr.send(null);
//4.回調
xhr.onreadystatechange = function () {
    /*xhr.readyState == 4  是表示數據解析完成,后臺處理完成了。
       xhr.status == 200 是表示處理的結果是OK的。響應成功*/
    if (xhr.readyState == 4){
        if(xhr.status == 200){
            //返回結果
            var result = xhr.responseText;
            console.log(result); 
        }
    }
};
2.post方法
//#1.創建對象 兼容性
var xhr = null;
//處理低版本IE不兼容問題
if(window.XMLHttpRequest){
    xhr = new XMLHttpRequest();
}else{
    xhr = new ActiveXObject("Microsoft.XMLHTTP")
}
//#2.準備發送
xhr.open("post","xxx.php",true);
// 參數
var param = "phone=" + phoneValue;
//設置響應頭
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//#3.執行發送
xhr.send(param);

//#4.回調函數
xhr.onreadystatechange = function () {
    if(xhr.readyState == 4){
        if(xhr.status ==200){
            var result = xhr.responseText;
            console.log(result);
        }
    }
}
open()方法后面的參數truefalse,表示異步和同步,同步(false)就是先吃完飯才能看電視,異步(true)就是邊吃飯邊看電視**
二、 jQuery中的使用Ajax 1.基本使用方法
$.ajax({
    url: "xxx.php",
    type: "get",
    beforeSend: function(xhr){
        console.log(xhr);
    },
    success: function (res) {
        console.log(res);
    },
    error:function (xhr) {
        console.log(xhr);
    },
    complete:function (xhr) {
        console.log(xhr);
    }
});

post方式只需把type值改成 get就行

2.快捷方式
$.get("xxx.php",{id:1},function (res) {
    console.log(res);
});

$.post("xxx.php",{id:1},function (res) {
    console.log(res);
});
以上是getpost兩種方式
3.解析Json格式
$.getJSON("xxx.php",{id:1},function (res) {
    console.log(res);
});
或者在放置json格式文件的php中進行申明頭部
 "張三",
    "age"  => 18
);
//格式
header("Content-Type:application/json");
echo json_encode($zhangsan);
?>

文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。

轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103731.html

相關文章

  • 原生JS與jQueryAJAX實現

    摘要:原生與對的實現一定義里這么解釋異步的和。二原生實現所有現代瀏覽器以及均內建對象。一般是正常未找到頁面,一般是錯誤,或者后臺沒有創建相應的內部服務錯誤,多為后臺錯誤?;旧贤ㄟ^發送的數據及傳回的數據就能定位問題所在了。 原生JS與jQuery對AJAX的實現 一、定義 W3C里這么解釋AJAX: AJAX = Asynchronous JavaScript and XML(異步的 Jav...

    Chaz 評論0 收藏0
  • 原生JavaScript實現AJAX、JSONP

    摘要:在這里講解一下用原生如何實現。當然,前面也說過,你可以給定固定回調函數名最后我已經將和請求合并在一起了,下載鏈接原文鏈接原生實現如有問題,歡迎在下方留言 相信大多數前端開發者在需要與后端進行數據交互時,為了方便快捷,都會選擇JQuery中封裝的AJAX方法,但是有些時候,我們只需要JQuery的AJAX請求方法,而其他的功能用到的很少,這顯然是沒必要的。 其實,原生JavaScript...

    xcc3641 評論0 收藏0
  • 前端相關大雜燴

    摘要:希望幫助更多的前端愛好者學習。前端開發者指南作者科迪林黎,由前端大師傾情贊助。翻譯最佳實踐譯者張捷滬江前端開發工程師當你問起有關與時,老司機們首先就會告訴你其實是個沒有網絡請求功能的庫。 前端基礎面試題(JS部分) 前端基礎面試題(JS部分) 學習 React.js 比你想象的要簡單 原文地址:Learning React.js is easier than you think 原文作...

    fuyi501 評論0 收藏0
  • 分別使用 XHR、jQuery Fetch 實現 AJAX

    摘要:本文詳細講述如何使用原生和來實現。使用可以無刷新地向服務端發送請求接收服務端響應,并更新頁面。分別要用到的方法和方法。,,都是現在和未來解決異步的標準做法,可以完美搭配使用。這也是使用標準一大好處。 本文詳細講述如何使用原生 JS、jQuery 和 Fetch 來實現 AJAX。 AJAX 即 Asynchronous JavaScript and XML,異步的 JavaScript...

    Julylovin 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<