浅谈ajax（一）

AJAXS：异步的javascript及XML（Asynchronous JavaScript And XML）

ajax是2005年有google推广开来的一种编程模式。

ajax不是新的编程语言，而是一种使用现有标准的新的方法。

ajax可以创建更好、更快以及友好的web应用程序。

ajax是基于javascript和http请求（http request）

现阶段使用ajax的案例：新浪微博、google地图、开心网等大多数的网站。

下面来看一个demo：

<html>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>ajax</title>
  <script type="text/javascript">
      function loadXml(){
	     alert("ok");
	  
	  }
  </script>
</head>

<body>
    <div id="myDiv">
	    <h3>用ajax改变这个文本！</h3>
	</div>
	<!--<input type="button" onClick=""></input> -->
	<button type="button" onClick="loadXml()">改变文本</button>
</body>

</html>

在这里值得一提的是 XML HttpRequest是ajax的基础。

XML HttpRequest对象

XML HttpRequest由于后台与服务器进行交换数据，这就意味着可以在不重新加载整个网页的情况下，对网特的某部分进行更新。

1、创建XML HttpRequest对象

创建XML HttpReques对象的语法格式： variable = new XMLHttpRequest();

对于老版本的ie使用的是activeX对象

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

在我们的实际项目中，通常为了适应现在的浏览器，需要检查是否是支持XML HttpReques对象，如果支持，则创建XMLHttpRequest对象，

如果不支持，则创建ActiveXObject；

var xmlhttp;
if(windows.XMLHttpRequest)
{
    xml=new XMLHttpRequest();
   //对于支持xmlhttprequest对象的浏览器这里面直接创建
}
else
{
    xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}

2、向服务器发送请求

如果需要向服务器发送请求，我们使用的是XMLHttpRequest对象的open（）、send()两个方法。

xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();

方法	描述
open（method,url,async）	method是指请求的类型，GET或者POST；url是文件在服务器的位置；async：同步或异步（true）
send（String ）	用于POST请求

但是这里面出现一个问题：到底使用GET还是POST，我们来说一下POST和GET的区别：

与POST相比GET更简单更快，并且在大多数的情况下是可以使用的。

但是在以下的情况中是必须使用POST请求的：

1、无法使用缓存文件更新服务器上面的文件或者数据库）

2、向服务器发送大量的数据。

3、发送半酣位置字符的用户的输入时，POST比GET更稳定也更可靠。

一个简单的GET请求：

xmlhttp.open("GET","demo.jsp",true);
xmlhttp.send();

但是在这个例子中，我们可能会得到的是缓存的结果，为了避免这种缓存的出现，我们想指向URL添加一个唯一的ID：

xmlhttp.open("GET","demo.jsp?t="+Math.random(),true);
xmlheep.send();

另外：如果需要使用GET方法发送信息并带上参数的时候我们可以这么写：

xmlhttp.open("GET","demo.jsp?t="+name=Davint&age=24",true);
xmlhttp.send();

POST请求

一个简单的post请求：

xmlhttp.open("POST",true);
xmlhttp.send();

如果想html或者jsp页面里面那样POST数据，我们可以使用 setRequestHeader（）来添加HTTP头，然后再send（）中规定希望发送的数据是什么；

xmlhttp.open("POST",true);
xml.setRequestHeader("Content-type","appliacation/x-www-form-urlencode");
xmlhttp.send(name=Davint&age=24);

setRequestHeader(header，value)：想请求添加HTTP头，header规定头的名称是什么；value用来规定头的值。原文链接：https://www.f2er.com/ajax/166885.html

猜你在找的Ajax相关文章