AJAX介绍和应用

博客阐明

文章所波及的材料来自互联网整顿和集体总结，意在于集体学习和教训汇总，如有什么中央侵权，请分割自己删除，谢谢！

菜鸟教程地址

https://www.runoob.com/ajax/ajax-tutorial.html

简介

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 不是新的编程语言，而是一种应用现有规范的新办法。

AJAX 最大的长处是在不从新加载整个页面的状况下，能够与服务器替换数据并更新局部网页内容。

AJAX 不须要任何浏览器插件，但须要用户容许JavaScript在浏览器上执行。

异步和同步

客户端和服务器端互相通信的根底上

  • 客户端必须期待服务器端的响应。在期待的期间客户端不能做其余操作。
  • 客户端不须要期待服务器端的响应。在服务器解决申请的过程中，客户端能够进行其余的操作。

实现形式

应用js
//1.创立外围对象var xmlhttp;if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari    xmlhttp=new XMLHttpRequest();}else{// code for IE6, IE5    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}//2. 建设连贯/*    参数：        1. 申请形式：GET、POST            * get形式，申请参数在URL后边拼接。send办法为空参            * post形式，申请参数在send办法中定义        2. 申请的URL：        3. 同步或异步申请：true（异步）或 false（同步） */xmlhttp.open("GET","ajaxServlet?username=tom",true);//3.发送申请xmlhttp.send();//4.承受并解决来自服务器的响应后果//获取形式 ：xmlhttp.responseText//什么时候获取？当服务器响应胜利后再获取//当xmlhttp对象的就绪状态扭转时，触发事件onreadystatechange。xmlhttp.onreadystatechange=function(){    //判断readyState就绪状态是否为4，判断status响应状态码是否为200    if (xmlhttp.readyState==4 && xmlhttp.status==200)    {       //获取服务器的响应后果        var responseText = xmlhttp.responseText;        alert(responseText);    }}
应用jquery

$.ajax实现

$.ajax({    url:"ajaxServlet1111" , // 申请门路    type:"POST" , //申请形式    //data: "username=jack&age=23",//申请参数    data:{"username":"jack","age":23},    success:function (data) {        alert(data);    },//响应胜利后的回调函数    error:function () {        alert("出错啦...")    },//示意如果申请响应呈现谬误，会执行的回调函数    dataType:"text"//设置承受到的响应数据的格局});

$.get 发送get申请

  • 语法：$.get(url, [data], [callback], [type])
  • 参数：

    url：申请门路

    data：申请参数

    callback：回调函数

    type：响应后果的类型

$.post() 发送post申请

  • 语法：$.post(url, [data], [callback], [type])
  • 参数：

    url：申请门路

    data：申请参数

    callback：回调函数

    type：响应后果的类型

感激

菜鸟教程

黑马程序员

万能的网络

以及勤奋的本人