好程序员Java学习路线分享原生Ajax的使用

好程序员Java学习路线分享原生Ajax的使用，首先我们先来看一下什么是 AJAX

    AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。    AJAX 就是 异步、  和  。    AJAX 是一种用于创建快速动态网页的技术。    通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。    传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。

AJAX 工作原理

Browser浏览器            Server服务器发起事件创建 HttpRequest对象发送请求                                        接收客户端发送的对象                        回复一个ResponseText对象接收ResponseText结果更新页面局部数据                                                  

HttpRequest 对象

 HttpRequest 是 AJAX 的基础。所有现代浏览器均支持  HttpRequest 对象（IE5 和 IE6 使用 ActiveX ）。 HttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

创建 HttpRequest 对象

所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建  HttpRequest 对象。创建  HttpRequest 对象的语法：variable=new  HttpRequest();为了应对所有的现代浏览器，包括 IE5 和 IE6，请检查浏览器是否支持  HttpRequest 对象。如果支持，则创建  HttpRequest 对象。如果不支持，则创建 ActiveX  ：**实例**var  http;if (window. HttpRequest){    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码     http=new  HttpRequest();}else{    // IE6, IE5 浏览器执行代码     http=new ActiveX ("Microsoft. HTTP");}

AJAX - 向服务器发送请求请求

 HttpRequest 对象用于和服务器交换数据。向服务器发送请求    如需将请求发送到服务器，我们使用  HttpRequest 对象的 open() 和 send() 方法：         http.open("GET","ajax_info.txt",true);         http.send();open(method,url,async)    规定请求的类型、URL 以及是否异步处理请求。    method：请求的类型；GET 或 POST    url：文件在服务器上的位置    async：true（异步）或 false（同步）send(string)    将请求发送到服务器。    string：仅用于 POST 请求

GET 还是 POST？

与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。然而，在以下情况中，请使用 POST 请求：    无法使用缓存文件（更新服务器上的文件或数据库）    向服务器发送大量数据（POST 没有数据量限制）    发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

GET 请求

 http.open("GET","/try/ajax/demo_get.php",true); http.send();如果您希望通过 GET 方法发送信息，请向 URL 添加信息： http.open("GET","/try/ajax/demo_get2.php?fname=Henry&lname=Ford",true);

http.send();

POST 请求

一个简单 POST 请求： http.open("POST","/try/ajax/demo_post.php",true); http.send();如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据： http.open("POST","/try/ajax/demo_post2.php",true); http.setRequestHeader("Content-type","application/x-www-form-urlencoded"); http.send("fname=Henry&lname=Ford");

AJAX - 服务器 响应

请规定在响应处于   事件中的就绪状态时执行的函数：服务器响应如需获得来自服务器的响应，请使用  HttpRequest 对象的 responseText 或 response  属性。responseText    获得字符串形式的响应数据。response     获得   形式的响应数据。