原生的ajax

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了原生的ajax相关的知识,希望对你有一定的参考价值。

异步javascript和XML,AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新

这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。

步骤:
1.创建一个核心对象 XMLHttpRequest

xmlhttp=null;
if (window.XMLHttpRequest){
    // code for Firefox, Opera, IE7, etc.
    xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject){
    // code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}


2.编写一个回调函数

xmlhttp.onreadystatechange=function(){
    if(xmlhttp.readyState==4 && xmlhttp.status==200){
        //接受服务器回送过来的数据
        alert(xmlhttp.responseText);
    }
}

3.编写请求方式和请求的路径(open操作)

xmlhttp.open("请求方式","URL");


4.发送请求(send操作)

xmlhttp.send();


ajax-api详解
常用属性:
onreadystatechange:检测readyState状态改变的时候
readyState:ajax核心对象的状态
0:核心对象创建
1:调用了open方法
2:调用了send方法
3:部分响应已经生成(没有意思)
4:响应已经完成(使用的是这个状态)
status:状态码
if(xmlhttp.readyState==4 && xmlhttp.status==200){
}
responseText:响应回来的文本
常用方法:
open("请求方式","请求路径"[,"是否异步"]):设置请求的方式和请求的路径
send(["参数"]):发送请求 参数是请求方式为post的时候的参数
setRequestHeader("content-type","form表单enctype属性"):设置post请求的参数的类型 必须放在send方法之前.





















以上是关于原生的ajax的主要内容,如果未能解决你的问题,请参考以下文章

ajax简介+原生ajax代码

Ajax 原生底层代码

原生ajax 方法封装

使用原生ajax及其简单封装

原生Ajax 和Jq Ajax

原生js封装ajax代码