入门实例
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <Metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"> <title>Inserttitlehere</title> <scripttype="text/javascript"> window.onload=function(){ //获取a结点，并未其添加onclick响应函数 document.getElementsByTagName("a")[0].onclick=function(){ varrequest=newXMLHttpRequest(); //加上时间戳可以起到禁用缓存的效果 varurl=this.href+"?time="+newDate(); varmethod="GET"; request.open(method,url); request.send(null); //为XMLHttpRequest对象添加onreadystatechange响应函数 request.onreadystatechange=function(){ //判断相应是否完成 if(request.readyState==4){ if(request.status==200||request.status==304){ //当readyState为4的时候，responseText才可用 alert(request.responseText); }elseif(request.status==404){ alert("请求的页面不存在"); } } } returnfalse; } } </script> </head> <body> <ahref="helloAjax2.txt">helloAjax.txt</a> </body> </html>
发送POST请求
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <Metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"> <title>Inserttitlehere</title> <scripttype="text/javascript"> window.onload=function(){ //获取a结点，并未其添加onclick响应函数 document.getElementsByTagName("a")[0].onclick=function(){ varrequest=newXMLHttpRequest(); //加上时间戳可以起到禁用缓存的效果 varurl=this.href+"?time="+newDate(); varmethod="POST"; request.open(method,url); request.setRequestHeader("ContentType","application/x-www-form-urlencoded"); request.send("name='umgsai'");//设置请求参数 //为XMLHttpRequest对象添加onreadystatechange响应函数 request.onreadystatechange=function(){ //判断相应是否完成 if(request.readyState==4){ if(request.status==200||request.status==304){ alert(request.responseText); }elseif(request.status==404){ alert("请求的页面不存在"); } } } returnfalse; } } </script> </head> <body> <ahref="helloAjax2.txt">helloAjax.txt</a> </body> </html>
开发中多用JQuery，不用考虑浏览器的兼容性。
本文出自 “优赛工作室” 博客，请务必保留此出处http://www.jb51.cc/article/p-rzjhsgku-qg.html
原文链接：https://www.f2er.com/ajax/162446.html