<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
title
>
Ajax入门示例
</
title
>
</
head
>
<
script
type
="text/jscript"
>
var xmlhttp;
function createHTTP()
{
if(window.ActiveXObject)
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); //IE浏览器中创建异步调用对象
}
else if(window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest(); //Firefox中创建异步调用对象
}
}
function startHTTP()
{
//第一步:根据不同的浏览器创建异步调用对象(XMLHttpRequest)
createHTTP();
//第二步:加载数据所在的服务器,Ajax可以从其他网站获取数据,也可以从本地的XML文件中获取
//语法如下:xmlhttp.open(method,url,bool)
//method:表示HTTP的请求方法,一共有get、post、head、put、delete五种方法;get是将参数追加到URL中发送,而post是将参数串放在请求体中发送。如果数据处理不改变数据的状态(比如获取数据),就用get;如果编辑、更新数据等改变了数据,则用post。
//URL:表示数据的地址;bool:表示是否使用异步获取,true表示异步,false表示同步
xmlhttp.open("GET","XMLFile.xml",true);
//第三步:异步调用服务器状态的变化:状态变化与事件挂钩,注意方法后面不带括号
xmlhttp.onreadystatechange=StateDO;
//第四步:发出一个HTTP请求。可以通过在发送请求时设置的参数有选择的挑选数据。如果发送请求时,参数已经放在了请求的URL中,则send方法中,参数可以设置为null或者不写。如果希望把参数放在send方法中,则语法如下:xmlhttp.Send(“id=cgjun”); 由于用Send方法发送参数时,需要考虑很多环境变量,如HTTP Method和服务器的一些设置,所以建议将参数放在请求的URL中
xmlhttp.send(null);
}
function StateDO()
{
//判断是否完成状态(异步调用完成时,状态编号为4);返回的状态代码=200,表示调用成功;返回的状态代码=400,表示没有找到
if(xmlhttp.readystate==4 && xmlhttp.status==200)
{
document.getElementById("mytext").innerHTML=xmlhttp.responsetext;
}
}
</
script
>
<
body
>
<
div
style
=""
id
="mytext"
>
这是旧数据
</
div
><
input
type
="button"
value
="更新DIV"
onclick
="startHTTP()"
/></
body
></
html
>
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/a41954a27d6ad96fa2c2cf816e677448.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/717446ca04a6125dc5b6b54e0fa14ab4.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/717446ca04a6125dc5b6b54e0fa14ab4.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/717446ca04a6125dc5b6b54e0fa14ab4.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/717446ca04a6125dc5b6b54e0fa14ab4.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/37c8bf68cdc3cc81759c34160776bc53.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6a9c071a08f1dae2d3e1c512000eef41.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/717446ca04a6125dc5b6b54e0fa14ab4.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/0196c3df5ea9e936f21e9932cca91014.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)
![](https://i-blog.csdnimg.cn/blog_migrate/6810355c2f78c12e91b7997a8e8c583a.gif)