ajax的两种实现

Posted 2022-01-19 lingdu9527

1、通过jQuery发起Ajax请求

 1 <script type="text/javascript"
 2     src="$pageContext.request.contextPath/js/jquery.min.js">
 3     
 4 </script>
 5 <script type="text/javascript">
 6     setInterval("AjaxJquery()", 3000);
 7     function AjaxJquery() //通过jQuery发起请求
 8         $.ajax(
 9             url : "$pageContext.request.contextPath/ajax_do",
10             type : "get",
11             error:function()
12                 alert("请求失败");
13             ,
14             success : function(msg) 
15                 $("#msg").append(msg);
16             
17         );
18     
19 </script>

setInterval(调用的方法,每个多少毫秒发起)
url:发送请求的地址
type:请求方式
cache:缓存(false每次都清空缓存)
error：请求失败
success:请求后回调函数

2、通过原生的XmlHttpRequest发起请求

 1 <script type="text/javascript"
 2     src="$pageContext.request.contextPath/js/jquery.min.js">
 3     
 4 </script>
 5 <script type="text/javascript">
 6     setInterval("Ajax()", 3000);
 7 function Ajax()//通过XMLHttpRequest发起请求
 8         var xmlhttp = new XMLHttpRequest();//创建XMLHttpRequest对象
 9         xmlhttp.open("post","$pageContext.request.contextPath/ajax_do",true);
10         xmlhttp.send();
11         //接收服务器返回数据
12         xmlhttp.onreadystatechange=function()
13             if(xmlhttp.readyState==4&&xmlhttp.status==200)
14                 //得到服务端响应
15                 $("#msg").append(xmlhttp.responseText);
16             
17         
18     
19 </script>