如何在js中寫ajax

如何在js中寫ajax？針對這個問題，這篇文章詳細介紹了相對應的分析和解答，希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

在JavaScript中使用ajax有兩個作用：

1.讓js去讀服務器上面的數據.

2.無刷新的情況下讀取服務器上面的數據,例如:驗證賬號和密碼是否正確等.

對于網絡請求我們知道有Get 和Post兩種，它們之間的區別是什么呢？

get方式:常見的表單提交方式:將值在url后面提交;?名字=值&名字=值格.

提交表單例子:

<form  action="www.baidu.com " method="get" (默認是get方式)>
姓名:<input type="text" name="userName"></br>
密碼:<input type="password" name="password">
<input type="submit" value="提交">
</from>

區別:

1.get方式是通過網址進行傳遞數據的,post是通過http中Content進行傳遞的.

2.get容量小,不適合傳遞大數據,(一般4k-10k),post方式容量相對大很多,一般服務器可以達到2G容量.

3.對于太大的文件,就不會走post,走控件.

4.get方式安全性差,post相對來說會好一點,一幫安全只能走https.

5.get方式是有緩存的,post沒有緩存. get更適合向服務器獲取數據,post更適合向服務器傳遞數據,

在JS中AJAX的兩種寫法：

GET方式:

var ajaxObj=new XMLHttpRequest();
ajaxObj.open("GET","../php/ajaxSubmitData.php?data=tody is wind");
ajaxObj.send()
ajaxObj.onreadystatechange= function () {
    if(ajaxObj.readyState===4&&ajaxObj.status){
        alert("發送成功");    
    }
}

POST方式：

var ajaxObj=new XMLHttpRequest();
ajaxObj.open("POST","../PHP/ajaxSubmitData.php");
ajaxObj.setRequestHeader("Content-type","application/x-www-form-urlencoded");
// multipart/form-data 默認的以二進制方式傳送
ajaxObj.send("data=我是post數據");
ajaxObj.onreadystatechange= function ()
if(ajaxObj.readyState===4&&ajaxObj.status===200){
alert("發送數據成功");
}
}

ajax獲取從服務器返回的數據是 ajaxObj.responseText獲取

ajax 給服務器發送數據: get post

get: url重寫(拼接) ---- 數據量小 簡單數據 不安全

post:send(數據) 請求體(頁面看不到) 數據量大 簡單或復雜數據 安全

application/x-www-form-urlencoded表示表單默認以字符串的形式發送

multipart/form-data 表單數據以二進制流的方式發送

ajaxObj.setRequestHeader其實就是修改請求頭(請求報文)里面的額Content-type值

關于如何在js中寫ajax問題的解答就分享到這里了，希望以上內容可以對大家有一定的幫助，如果你還有很多疑惑沒有解開，可以關注億速云行業資訊頻道了解更多相關知識。