|
首先，我们随意写个JSON格式的数据文件user.txt
Java代码
{
userName: "nihao",
sex: "male",
age: "23"
}
 下面我们写个AJAX用到一个基本的ajax.js文件一般这里我们这个文件分别写出来。 Java代码
function createXMLHttpRequest() {
var req;
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
}else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
return req;
}
另外，我们导入一个Ajax的资源文件prototype1.6.js，在结束时我上传给大家。 然后，我们建个主页面来jsontest.html测试下AJAX读取JSON格式的数据。 Java代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <!-- 导入两个js文件 --> <script type="text/javascript" src="./ajax.js"></script> <script type="text/javascript" src="./prototype1.6.js"></script> <title>jsontest.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=GB18030"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <script type="text/javascript"> var req = createXMLHttpRequest(); function startRequest(){ try{ req.onreadystatechange = handleStateChange; req.open("GET", "user.txt", true); req.send(null); }catch(exception){ alert(""); } } function handleStateChange(){ if(req.readyState == 4){ if (req.status == 200 || req.status == 0){ // 取得返回字符串 var resp = req.responseText; // 构造返回JSON对象的方法 var func = new Function("return " + resp); // 得到JSON对象 var json = func( ); // 显示返回结果 alert("userName: " + json.userName + " " + "sex: " + json.sex + " " + "age: " + json.age); } } } </script> </head> <body> <div> <input type="button" value="json's value" onclick="startRequest();" /> </div> </body> </html> 试运行结果，大家自己去调试了，在浏览器里输入http://localhost:8080/jsontest/jsontest.html即可了。 最后，给大家上传AJAX的一个js资源文件prototype1.6.js |
|
|
