app下载网站建设,做小型网站的公司,2021免费正能量网站,网站开发与技术分析目录 1.什么是ajax
2.ja原生ajax
3.jQuery框架的ajax
4.综合案例 1.什么是ajax Ajax 即Asynchronous Javascript And XML#xff08;异步 JavaScript 和 XML#xff09;#xff0c;是指一种创建交互式网页应用的网页开发技术。Ajax 异步 JavaScript 和 XMLAsynchronous Javascript And XML异步 JavaScript 和 XML是指一种创建交互式网页应用的网页开发技术。Ajax 异步 JavaScript 和 XML标准通用标记语言的子集。通过在后台与服务器进行少量数据交换Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下对网页的某部分进行更新。传统的网页不使用 Ajax如果需要更新内容必须重载整个网页页面。 同步方式发送请求 发送一个请求需要等待响应返回然后才能够发送下一个请求如果该请求没有响应不能发送下一个请求客户端会处于一直等待过程中。(卡死) 异步方式发送请求 发送一个请求不需要等待响应返回随时可以再发送下一个请求即不需要等待。 2.ja原生ajax 1创建Ajax引擎对象 2为Ajax引擎对象绑定监听服务器变化的事件 设置回调函数(自定义函数,服务器响应成功后,AJAX自动调用函数) 3绑定提交地址 4发送请求 5接受响应数据 function butOnclick() {//1.获取AJAX对象var xmlhttp new XMLHttpRequest();//2.给AJAX对象添加监听AJAX引擎状态变化的事件,并设置事件的回调函数xmlhttp.onreadystatechangefunction(){ if (xmlhttp.readyState4 xmlhttp.status200){// 5.获取服务器响应的数据document.getElementById(myDiv).innerHTMLxmlhttp.responseText;}}//3.绑定要发送到服务器的地址xmlhttp.open(GET,${pageContext.request.contextPath}/js_ajax,true);//4.把AJAX请求发送到服务器xmlhttp.send();}input typebutton valueAJAX异步提交 onclickbutOnclick()/div idmyDiv/div 3.jQuery框架的ajax 语法jQuery.get(url, [data], [callback], [type]) GET请求方式 $(#btn).click(function (){$.get(http://localhost:8080/MyFilter_war_exploded/ajax,{name:list},function (data){$(#div).html(data);}) ;POST请求方式 $.post(/MyFilter_war_exploded/ajax,{name:list},function (data){$(#div).html(data);}) AJAX请求方式 $.ajax({//1:URL地址url:/MyFilter_war_exploded/ajax,// 2:异步请求async:true,//3:给服务器传递参数data:namehaohaoage33,//4:请求方式type:POST,//5 :响应数据的类型dataType:text,// 6 回调函数 data 接受到的服务器响应过来的数据success:function(data){alert(data);},//7: 回调函数服务器出错的时候执行error:function(){alert(数据没有成功返回!)}}); 4.综合案例
检测用户名是否已经被注册
