如何实现JavaScript前端与后台进行高效数据交互的方法？

本文共计302个文字，预计阅读时间需要2分钟。

在开发中遇到了没有jQuery的情况，需要与后台进行部分数据的交互。找到了部分资料，使用JavaScript实现了操作，记录一下。

获取XMLHttpRequest对象用于与后台交互：javascriptfunction getXHR() { var xhr; if (window.XMLHttpRequest) { xhr=new XMLHttpRequest(); } else { xhr=new ActiveXObject(Microsoft.XMLHTTP); } return xhr;}

在开发中遇到了在没有jQuery的情况下需要与后台进行部分数据的交互，查找了部分资料使用JavaScript实现了操作，记录一下。

//获取XMLHttpRequest对象用于与后台交互数据

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.注册状态变化监听器 xhr.onreadystatechange=function(){ if(xhr.readyState==4) { if(xhr.status==200) { var obj = document.getElementById("checkPass"); if("true" == xhr.responseText){ obj.innerHTML = "验证通过"; obj.style.color = "green"; }else{ obj.innerHTML = "原密码输入错误！"; obj.style.color = "brown"; return; } } } } //3.建立与服务器的连接（post请求方式，也可以使用get请求方式） xhr.open("post","请求数据的地址"); xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded'); //4.向服务器发出请求(使用post请求方式将数据发往后台) xhr.send("pass="+pass); }

到此这篇关于javascript前端和后台进行数据交互方法的文章就介绍到这了,更多相关javascript前端和后台数据交互内容请搜索易盾网络以前的文章或继续浏览下面的相关文章希望大家以后多多支持易盾网络！