ajax异步求知识点,Ajax基础知识点梳理

1.ajax介绍

Ajax(asynchronous JavaScript and XML)：异步的JavaScript和xml，是一种异步请求数据的web开发技术，在不重新加载整个页面的情况下，可以与服务器交换数据并更新网页部分内容。Ajax目的是提高用户体验，较少的网络数据的传输量。

2.ajax原理

(1)浏览器创建一个XMLHttpRequest对象，然后发送对象去服务器请求数据；

(2)服务器接受XMLHttpRequest并返回数据；

(3)浏览器接受返回数据并渲染页面；

3.ajax是基于现有的internet标准

a.XMLHttpRequest 对象 (异步的与服务器交换数据)

b.JavaScript/DOM (信息显示/交互)

c.CSS (给数据定义样式)

d.XML (作为转换数据的格式)

注意： AJAX应用程序与浏览器和平台无关的！

4.原生js的ajax使用

//创建XMLHttpRequest对象

var xmlhttp=null;

if (window.XMLHttpRequest)

{// 兼容 IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

} else{// 兼容 IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

//向服务器发送请求

xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);

xmlhttp.send();

注意：xmlhttp.open(method,url,async);

xmlhttp.send();

Method：请求的方式，get或者post

Url：请求路径

Async：是否异步，true(异步)false(同步)

但是当请求方式为post时要设置请求头的格式，举例：

xmlhttp.open("POST","test.html",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send(xxxx);  //post请求参数放在send里

//浏览器对服务器响应进行处理

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 && xmlhttp.status==200){

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

onreadystatechange存储函数，当readyState属性改变时，调用该函数。

readyState：存储XMLHttpRequest状态。

0：请求未初始化；

1：服务器连接已建立

2：请求已接受

3：请求处理中

4：请求已完成，且响应就绪

Status：常用状态码

200:’ok’

404:未找到页面

(根据菜鸟教程整理)