javascript前端和后臺進(jìn)行數(shù)據(jù)交互方法示例
在開發(fā)中遇到了在沒有jQuery的情況下需要與后臺進(jìn)行部分?jǐn)?shù)據(jù)的交互,查找了部分資料使用JavaScript實(shí)現(xiàn)了操作,記錄一下。
//獲取XMLHttpRequest對象用于與后臺交互數(shù)據(jù)
function getXHR(){
var xmlHttp;
try {
xmlHttp=new XMLHttpRequest();//新版本瀏覽器
}catch(e)
{
try{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");//老版本瀏覽器 }
catch(e)
{
alert("你的瀏覽器不支持ajax");
return false;
}
}
}
return xmlHttp;
}
function check() {
var pass = document.getElementById("pass").value;
//1/得到xhr對象
var xhr=getXHR();
//2.注冊狀態(tài)變化監(jiān)聽器
xhr.onreadystatechange=function(){
if(xhr.readyState==4) {
if(xhr.status==200) {
var obj = document.getElementById("checkPass");
if("true" == xhr.responseText){
obj.innerHTML = "驗(yàn)證通過";
obj.style.color = "green";
}else{
obj.innerHTML = "原密碼輸入錯誤!";
obj.style.color = "brown";
return;
}
}
}
}
//3.建立與服務(wù)器的連接(post請求方式,也可以使用get請求方式)
xhr.open("post","請求數(shù)據(jù)的地址");
xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
//4.向服務(wù)器發(fā)出請求(使用post請求方式將數(shù)據(jù)發(fā)往后臺)
xhr.send("pass="+pass);
}
到此這篇關(guān)于javascript前端和后臺進(jìn)行數(shù)據(jù)交互方法的文章就介紹到這了,更多相關(guān)javascript前端和后臺數(shù)據(jù)交互內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
ES6新特性三: Generator(生成器)函數(shù)詳解
這篇文章主要介紹了ES6新特性之Generator(生成器)函數(shù),簡單分析了Generator(生成器)函數(shù)的功能、定義、調(diào)用方法并結(jié)合實(shí)例形式給出了相關(guān)使用技巧,需要的朋友可以參考下2017-04-04
javascript的事件觸發(fā)器介紹的實(shí)現(xiàn)
這篇文章主要介紹了javascript的事件觸發(fā)器介紹的實(shí)現(xiàn),本文所指觸發(fā)器是用程序來觸發(fā)綁定的事件,而不是人為的去觸發(fā),需要的朋友可以參考下2014-06-06
利用MutationObserver實(shí)現(xiàn)計算首屏?xí)r間
在前端開發(fā)中,優(yōu)化頁面性能是至關(guān)重要的,計算首屏?xí)r間是衡量網(wǎng)頁性能的重要指標(biāo),本文將介紹如何使用MutationObserver來獲取首屏?xí)r間的最佳實(shí)踐,感興趣的可以了解下2023-07-07
JS?中數(shù)組的增刪改查和對象的增刪改查實(shí)例詳解
這篇文章主要介紹了JS?中數(shù)組的增刪改查和對象的增刪改查實(shí)例詳解,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-07-07
javascript中parentNode,childNodes,children的應(yīng)用詳解
本篇文章是對javascript中parentNode,childNodes,children的應(yīng)用進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12

