分享Ajax创建简单实例代码
XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。几乎所有的浏览器都支持XMLHttpRequest对象,它是Ajax应用的核心技术。
js代码如下:
<html>
<head>
<title>NewDocument</title>
<metacharset="utf-8">
</head>
<scripttype="text/javascript">
/**创建XMLHttpRequest对象
*IE7+、Firefox、Chrome、Safari以及Opera均内建XMLHttpRequest对象
*IE5,IE6使用ActiveX对象,xmlHttp=newActiveXObject("Microsoft.XMLHTTP")
**/
functioncreateXMLHttpRequest(){
varxmlHttp;
if(window.XMLHttpRequest)
{
xmlHttp=newXMLHttpRequest();
}else{
xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4)
{
if(xmlHttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlHttp.responseText;
}
}else{
document.getElementById("myDiv").innerHTML="正在加载...";
}
};
//向服务器放松请求
xmlHttp.open("GET","test.php",true);
xmlHttp.send();
}
</script>
<body>
<inputtype="button"onclick="createXMLHttpRequest()"value="请求数据"/>
<divid="myDiv"></div>
</body>
</html>
对上面js代码部分解释:
(1).XMLHttpRequest对象的onreadystatechange属性,当请求被发送到服务器时,需要执行任务。每当readyState改变时,就会触发onreadystatechange事件。
(2).XMLHttpRequest对象的readyState属性,存有XMLHttpRequest的状态(0~4)。
- 0:请求未初始化
- 1:服务器连接已建立
- 2:请求已接收
- 3:请求处理中
- 4:请求已完成,且响应已就绪
(3).open(method,url,async)方法:规定请求的类型、URL以及是否异步处理请求。
(4).send(content)向服务器发送请求。
以上就是Ajax创建简单实例代码,希望对大家的学习有所帮助,大家也可以自己动手创建Ajax简单实例。