微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Ajax

AJAX 是一种用于创建快速动态网页的技术。 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。 AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。 AJAX 的核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术。简而言之,XMLHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户。 AJAX不是一种新的编程语言,而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。 
工作原理 

 
如何发送一个ajax请求? 
第一步:获取一个XMLHttpRequest对象 
第二步:设置一个回调函数 回调函数它的作用就是用于处理服务器响应的数据 通过XMLHttpRequest对象的onreadystatechange设置回调函数 
第三步设置请求方式GET/POST及请求的URL等 通过XMLHttpRequest对象的open方法 
第四步真正向服务器发送请求 通过XMLHttpRequest对象的send方法 
第五步在回调函数获取服务器响应的数据 通过XMLHttpRequest对象的responseText

  1. <title>Insert title here</title>
  2. <script type="text/javascript">
  3. var xmlhttp = null;
  4. function sendAjax() {
  5. //1.获取一个XMLHttpRequest对象
  6. if (window.XMLHttpRequest) {// code for all new browsers
  7. xmlhttp = new XMLHttpRequest();
  8. } else if (window.ActiveXObject) {// code for IE5 and IE6
  9. xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  10. }
  11. //2.设置回调函数
  12. xmlhttp.onreadystatechange = callback;
  13. //3.设置请求方式及url
  14. var url = "http://localhost:8080/ajax/ajax";
  15. xmlhttp.open("POST", url, true);
  16. xmlhttp.setRequestHeader("content-type","application/x-www-form-urlencoded");
  17. //4.向服务器发送请求
  18. xmlhttp.send(null);
  19. }
  20. //回调函数
  21. function callback() {
  22. //alert(xmlhttp.readyState); //得到状态码
  23. //if (xmlhttp.readyState == 4) {
  24. // if (xmlhttp.status == 200) {
  25. //5.得到响应数据
  26. // alert(xmlhttp.responseText);
  27. // }
  28. // } else {
  29. // alert("Problem retrieving XML data");
  30. // }
  31. }
  32. </script>
  33. </head>
  34. <body>
  35. <input type="button" value="按钮" onclick="sendAjax()">
  36. </body>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐