ajax基础用法
来源:互联网 发布:手机端 时间轴 源码 编辑:程序博客网 时间:2024/06/06 11:36
AJAX——–异步交互
客户端向服务器端发送请求,直到服务器端进行响应,这个过程中,用户可以做别的事情;
使用ajax可以在不刷新页面的情况下与服务器进行交互从而更新页面内容; 创建ajax四个步骤:
创建XMLHttpRequest对象
- 注册监听
- 建立连接
- 发送请求
原生js创建ajax (get方式)(实际使用中建议用jQuery创建ajax)
function loadXMLDoc(){var xmlhttp;if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest();}else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.onreadystatechange=function(){if (xmlhttp.readyState==4 && xmlhttp.status==200{ document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } }xmlhttp.open("GET",url);xmlhttp.send();}
jQuery创建ajax(详细)
- get与post在使用中的区别:
get请求类型
send()方法不起作用,但是不能被省略
请求参数 - 添加到URL?key=value - POST请求类型
send()方法起作用
在send()方法被调用前,使用setRequestHeader()方法设置请求头信息
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
- $.ajax() 封装第一层,最复杂;
$.ajax({url:"", type:"",data:{key:value},dataType:"json",success:function(data,textStatus){},error:function(XMLHttpRequest,textStatus,errorThrown){}})
以上为常用参数,各参数意义分别为
{* url - 请求参数//
- type - 请求类型(默认get)//
- data - 请求数据(key:value形式)//
- dataType - 响应数据格式(一般为json,html,xml格式, 跨域改为jsonp)//
- success - 请求成功后的回调函数(响应数据内容, 请求状态)//
- error - 请求失败后的回调函数(Ajax核心对象, 请求状态(error,timeout,notmodified等), 抛出异常)
}
().load() .get() $.post() 封装第二层,(后两个常用);$().load(url,data,callback){}
参数
url - 当前Ajax的请求地址
data - 当前Ajax的请求数据(key:value)
callback - 请求成功后的回调函数( 形参(data) -服务器端响应的数据内容 )
$.get(url,data,callback,type)
参数
url - Ajax的请求地址
data - Ajax的请求数据((key:value))
callback - Ajax请求成功后的回调函数( 形参(data) -服务器端响应的数据内容 )type - 设置服务器端响应数据的格式
HTML格式 (默认)
xml - XML格式
json - JSON格式 (一般常用).post()−请求类型是POST(使用方式与 .get()方法一致).getScript() .getJSON() 封装第三层 (特殊用法)
$.getScript(url,callback)
- 动态读取脚本(JavaScript代码)
url - 读取脚本的地址(本地或服务器)
callback - 读取成功后的回调函数
$.getJSON() - 接收JSON格式数据(用于跨域)
楼主目前还是新手,文章有什么不足或者需要改进的地方,希望大家留言提出。希望这篇文章对大家有用。
- ajax基础用法
- ajax基础用法
- ajax 用法
- ajax用法
- $.ajax()用法
- Ajax用法
- Ajax用法
- ajax 用法
- Ajax用法
- Ajax 基础
- Ajax基础
- Ajax基础
- AJAX基础
- AJAX基础
- ajax基础
- ajax基础
- Ajax 基础
- ajax基础
- css3 border-radius详解
- tomcat下部署了多个项目启动报错java web error:Choose unique values for the 'webAppRootKey' context-param in your
- javaweb中关于引用css和image的路径问题
- hdu1878 欧拉回路(无向图+并查集)
- 1003. Emergency (25)
- ajax基础用法
- Redis 集成Spring(spring-data-redis)
- 前端面试(简答)
- PAT排名汇总 (25分)
- android studio gradle 两种更新方法更新
- 有n人围成一圈,顺序排号。从第1个人开始报数(从1到3报数),凡报到3的人退出圈子,问最后留下的是原来的第几号的那位。
- 区域填充
- 1010
- 赋值