ajax学习:一个简单的例子

 

首先,以一个简单的例子,拉开学习的序幕,从下一篇文章开始,详细讲解其原理和应用。当然这其实是我自己学习

和应用ajax的一个过程。希望在写文章的过程中能够加深对这项技术的理解,也希望各位朋友能够吸取我的教训,少走弯路。

转载请说明出处:http://www.iwebtrados.com.cn/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Parsing XML Responses with the W3C DOM</title>

<script type="text/javascript" language="javascript">

var xmlHttp;

function createXMLHttpRequest() { //创建XMLHttp实例,考虑到兼容性问题,要做判断

    if (window.ActiveXObject) { //IE6以前

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

    }

    else if (window.XMLHttpRequest) { //其他浏览器

        xmlHttp = new XMLHttpRequest();

    }

}

 

function startRequest() {


    createXMLHttpRequest();

    xmlHttp.onreadystatechange = handleStateChange;  //异步调用的回调函数

    xmlHttp.open("GET", "test.asp", true); //连接服务器并访问

    xmlHttp.send(null);

}

 

function handleStateChange() {

 if(xmlHttp.readyState == 4) { //如果readyState==4 已经收到所有数据,可使用所有数据

        if(xmlHttp.status == 200) { //status==200,表示正常,结果在xmlHttp.responseText中

    var s;
    s=document.getElementById("result");
    s.innerHTML=xmlHttp.responseText; //利用javascript +dom 显示返回结果
        }

    }

}

</script>
</head>
<body onload="javascript:startRequest();">
服务器时间:
 <div id="result"></div>
</body>
</html>

服务器端:test.asp

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
</head>

<body>
<%
 response.Write(time()) 'response服务器时间
 %>
</body>
</html>

 

你可能感兴趣的:(Ajax)