Ajax 要点

发布时间：2020-12-16 03:03:43 所属栏目：百科来源：网络整理

导读：Ajax?全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML） Ajax的实现是基于 xmlHttp对象异步发送请求 XMLHttpRequest是ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术。简单的说，也就是javascript可以及时向服务器提出

Ajax?全称为“Asynchronous JavaScript and XML”（异步JavaScript和XML）

Ajax的实现是基于 xmlHttp对象异步发送请求

XMLHttpRequest是ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术。简单的说，也就是javascript可以及时向服务器提出请求和处理响应，而不阻塞用户。达到无刷新的效果。

??XMLHttpRequest对象主要属性：

??onreadystatechange??每次状态改变所触发事件的事件处理程序。

??responseText?????从服务器进程返回数据的字符串形式。

??responseXML????从服务器进程返回的DOM兼容的文档数据对象。

??status???????????从服务器返回的数字代码，比如常见的404（未找到）和200（已就绪）

??status Text???????伴随状态码的字符串信息

??readyState???????对象状态值

? XMLHttpRequest对象主要方法：

? open("method","URL")? ? 建立对服务器的调用。method参数可以是GET、POST或PUT。url参数可以是相对URL或绝对URL

??setRequestHeader ( )? ?把指定首部设置为所提供的值。在设置任何首部之前必须先调用open()。设置header并和请求一起发送 (‘post‘方法一定要 )

? send ( content )? ? ?向服务器发送请求,Get请求不需要设置content

JS原生发送Ajax get请求

function testGet() {
    var fname = document.getElementById("testGetName").value;
　　//添加请求参数
    xmlhttp.open("GET","Test.ashx?fname=" + fname + "&random=" + Math.random(),true);
    xmlhttp.onreadystatechange = callback;
    xmlhttp.send(null);
}

JS原生发送Ajax Post请求

function testPost() {
    var fname = document.getElementById("testPostName").value;
    xmlhttp.open("POST","Test.ashx?"  + "&random=" + Math.random(),true);
    //设置请求头
    xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
    xmlhttp.onreadystatechange = callback;
    //设置请求体
    xmlhttp.send("fname="+fname);
}

回调函数

function callback() {
    //readyState 状态码 4 表示请求已完成
    //status 状态200 表示请求数据成功
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
　　　　//返回的数据在 xmlHttp.responseText中保存
        document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
    }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!