javascript之ajax初探
ajax的无刷新功能非常强大,今天学习了一下ajax,一下是学习的笔记
重点:ajax必须是在本地服务器中运行,或者站点中运行,否则直接运行该文件是无效的!
1.将文件read.html放置在wamp的一个站点中
<!doctype html> <html> <head> <meta charset="utf-8"/> </head> <body> <button type="button" onclick="show()">请求数据</button> <script src="ajax.js"></script> <script> function show(){ Ajax('read.txt?datetime=new Date.getTime',function(str){alert(str);},function(){alert('失败了');})
//read.txt?datetime=new Date.getTime该方法可以组长缓存 //函数中需要传递3个参数(文件的路径,接受成功返回的值,获取失败放回的值) }; </script> </body> </html>
所载入的ajax.js文件
1 function Ajax(url,fnSucc,fnFaild) 2 { 3 //1.创建ajax对象 4 if(window.XMLHttpRequest) 5 {// code for IE7+, Firefox, Chrome, Opera, Safari 6 var oAjax=new XMLHttpRequest(); 7 } 8 else 9 {// code for IE6, IE5 10 var oAjax=new ActiveXObject("Microsoft.XMLHTTP"); 11 } 12 //2.链接服务器(打开服务器的连接) 13 //open(方法,文件名,异步传输) 14 oAjax.open('GET',url,true); 15 //3.发送 16 oAjax.send(); 17 //4.接收返回 18 oAjax.onreadystatechange=function() 19 { 20 if (oAjax.readyState==4) 21 { 22 if(oAjax.status==200) 23 { 24 fnSucc(oAjax.responseText); 25 } 26 else 27 { 28 fnFaild(oAjax.status); 29 } 30 31 }; 32 33 }; 34 35 }
if you don't try,you will never know!