Ajax基础笔记（以理解为主）_ajax 基础显示-CSDN博客

<数据>
       <数据1>宝马1</数据1>
       <数据2>宝马2</数据2>
       <数据3>宝马3</数据3>
<数据>
因为麻烦啰嗦，最后被json替换掉了
   优点：无需刷新页面即可与服务器端进行通信，允许根据用户时间来更新部分页面
   缺点：没有浏览历史，不能回退（因为并未更新页面），存在跨域问题，SEO不友好（搜索引擎优化不利，爬虫爬不到动态页面）

2、css、js为基础不做介绍

三、ajax的核心就是下面四个步骤完成的

1）创建异步对象

var xmlHttp = new XMLHttpRequest();

2）给异步对象绑定事件。

onreadystatechange 这个事件是当异步对象发起请求时，获取了数据都会触发它，这个事件需要绑定一个函数，在函数中处理状态的变化。

异步对象的属性 readyState 表示异步对象请求的状态变化，从0-4发生变化
       0：请求未初始化，创建异步请求对象 var xmlHttp = new XMLHttpRequest();
       1：初始化异步请求对象，xmlHttp.open(请求方式，请求地址，true)
       2：异步对象发送请求，xmlHttp.send()
       3：异步对象接受应答数据从服务端返回数据。XMLHttpRequest 内部处理，此时3，注意3是异步对象内部使用，获取了原始的数据
       4：异步请求对象已经将数据解析完毕。此时才可以读取数据。在4的时候，开发人员做什么呢？更新当前页面。
   异步对象的status属性，表示网咯请求的状态，200，404，500，需要是当status==200时，表示网咯请求成功

3）初始化异步请求对象

       异步的方法open().
       xmlHttp.open(请求方式get|post,"服务器端的访问地址"，同步|异步请求（默认式true，|异步请求）)
   例如：
   xmlHttp.open("get","loginServlet?name=zs&pwd=123",true)

4）使用异步对象发送请求

xmlHttp.send()
获取服务器端放回的数据，使用异步对象的属性responseText.
使用例子：xmlHttp.responseText

注意：回调：当请求的状态变化时，异步对象会自动调用onreadystatechange事件对应的函数

例如：
       xmlhttp.onreadystatechange=function(){
           处理请求的状态变化
           if(xmlHttp.readyState==4&&xmlHttp.status==200){
               //可以处理服务器端的数据，更新当前页面
               var data=xmlHttp.responseText;
               document.getElementById("name").value=data;
           }
       }