【AJAX】JS ajax模板及相关参数介绍

236 阅读1分钟

1.JS ajax模板

function Jsajax(url){
    //创建一个xmlHttp
    var xmlHttp =null;
   
    if (window.XMLHttpRequest)
    {
        // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
        xmlHttp=new XMLHttpRequest();
    }
    else
    {
        // IE6, IE5 浏览器执行代码
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    if(xmlHttp == null){
        alert("Browser does not support Http Request");
        return false;
    }
    //这里是当xmlHttp的状态发生改变时,执行的函数
    xmlHttp.onreadystatechange=function(){
        //当xmlHttp的状态码为4和200时,响应成功,用xmlHttp.responseText可以得到返回值
        if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
            var msg = xmlHttp.responseText;  
            return msg; //返回msg值
        }
    }
    //第一个可选POST或者GET方法,第二个是访问路径,第三个是 是否异步
    xmlHttp.open("POST", url, true);
    //设置响应头,必不可少
    xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    //选用POST方法可以在send里写要传的参数,格式 "属性名="+属性值+"&属性名"+属性值+.... ,GET方法里面没有参数
    xmlHttp.send("kind="+kind); 
 }

2.什么是AJAX?

AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

3.XHR请求和发送

xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();

在这里插入图片描述

4.XHR服务器响应

获得来自服务器的响应,使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。
在这里插入图片描述

5.XHR readyState

当 readyState 等于 4 且状态为 200 时,表示响应已就绪;
在这里插入图片描述

点击查看JS ajax详细教程