AJAX

1 .ajax的作用
js基础学习结束之后，我们肯定避不开的就是前后端交互，而AJAX就是js和服务器交互的手段。Ajax就是在浏览器不重新加载网页的情况下，对页面的某部分进行更新
2 .ajax简介
ajax （async javascript and XML(异步JavaScript和XML)），是前后太交互的能力，也就是我们给服务器发送消息以及接受响应的工具

ajax并不是新的编程语言，而是使用现有的一种方法

ajax在使用的时候不需要任何插件，我们可以直接使用原生js就可以，jQuery也提供的简单请求操作

同步和异步

在请求数据阶段，我们就要有同步请求和异步请求的概念

同步请求

同步请求是指当前发出请求后，浏览器什么都不能做，
必须得等到请求完成返回数据之后，才会执行后续的代码，
相当于生活中的排队，必须等待前一个人完成自己的事物，后一个人才能接着办。
也就是说，当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载，页面处于一个假死状态，
当这个AJAX执行完毕后才会继续运行其他代码页面解除假死状态
简单来说就是上一个任务结束之后下一个任务开始，比如我们常见的alert弹窗

异步请求

默认异步：异步请求就当发出请求的同时，浏览器可以继续做任何事，
Ajax发送请求并不会影响页面的加载与用户的操作，相当于是在两条线上，各走各的，互不影响。
一般默认值为true，异步。异步请求可以完全不影响用户的体验效果，
无论请求的时间长或者短，用户都在专心的操作页面的其他内容，并不会有等待的感觉。
简单来说就是多个任务按顺序开始执行，但是不一定按照顺序结束

AJAX 的使用

原生js
创建：var xhr = new XMLHttpRequest()
配置：xhr.open(请求方式,请求地址,是否异步)
请求方式：‘get’，‘post’
两者的区别：
1 语义化的区别:get偏向于获取,post偏向于提交数据
2 携带给后端的信息位置不一样
get直接在地址后面拼接查询字符串
post在请求体内进行信息的查询
3 携带的数据格式不一样
get:因为携带的数据是直接拼接在地址后面,只能使用url编码
post:因为在请求体内,所以可有多种形式,但是需要提前说明
4 携带的数据大小不一样
get:因为拼接在地址后面,大小在2kb左右
post:因为在请求体内,数据大小不受限制,除非服务器有显示
5 安全性能
get:明文发送,不安全
post:相对安全
6 浏览器缓存
get: 浏览器会主动缓存
post:浏览器不会主动缓存

请求地址：URL
这个URL是我们请求数据的地址。
是否异步:false true
默认值为 false 同步
true 异步
响应
xhr.onreadystatechange = function(){
(xhr.readyState === 4)//这个值必须等于4的时候才可以完成响应
xhr.responseText//这里可以拿到数据
}
发送
xhr.send()

jQuery 方法请求（我们可以使用jQuery提供的一系列方法来完成数据请求）

$.ajax({
type: ‘get’/‘post’,
url:’ ',
success:function(res){
cb(res)//请求成功之后执行一个回调参数，在之后使用
}
error:function(res){
cb(res)//请求失败之后执行一个回调函数
}
})

AJAX局部刷新数据相关推荐

Ajax局部刷新数据：添加、删除
今天用ajax局部刷新的方式,写了个搜索显示出局部数据和点击删除,页面同样局部更新删除数据异步搜索局部添加 1.盒子显示 2.ajax处理 url请求路径,experiment项目名,UserSer ...
ajax 刷新output,JSF生命周期及AJAX局部刷新
这些时间可能一直得搞JSF...... 呵呵,这个星期天再一次的仔细的研究了一下这个所谓的6个生命周期的运行情况以及所谓的AJAX局部刷新的问题. 看了core JSF里详细描述的JSF的生命周期,基 ...
JQuery 再谈ajax局部刷新
JQuery 再谈ajax局部刷新. 案例: 描述: 1. 点击登录则弹出登录对话框 2. 如果用户名密码不正确,则提示错误信息 3. 当输入信息正确,则刷新登录信息,显示用户名和退出按钮 4. 点击 ...
js 只刷新ajax,JS实现AJAX局部刷新（附代码）
这次给大家带来JS实现AJAX局部刷新(附代码),JS实现AJAX局部刷新的注意事项有哪些,下面就是实战案例,一起来看一下. AJAX即"Asynchronous Javascript An ...
ajax局部操作,ajax局部刷新是怎么操作的？具体什么步骤呢？
大家知道什么是ajax吗?是的,ajax就是用来局部刷新的作用,那么ajax是如何进行页面的局部刷新呢?具体操作又是怎么样的呢?接下来与大家一起来了解下ajax局部刷新的操作. 简单的来说Ajax就是 ...
ajax提交成功后局部刷新 jq_JQuery ajax局部刷新实例
在我们开发的时候,我们回时常用到javascript实现页面局部刷新,本文我们就和大家分享JQuery ajax局部刷新,具有一定的参考价值,感兴趣的小伙伴们可以参考一下案例: 描述: 1. 点击登 ...
Ajax局部刷新jsp页面
Ajax局部刷新jsp页面一.需求用户在使用复选框时,复选框的选项可能随用户的操作而发生变化,这时需要刷新该复选框选项,同时做到不刷新整个页面,也就是只刷新jsp页面的一部分,使用ajax异步请求 ...
js ajax局部替换,纯JS实现AJAX局部刷新功能
AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX = 异步 J ...
使用AJAX局部刷新页面
使用AJAX局部刷新页面局部刷新页面也就是定时性获取数据库信息,此方法也适用于刷新表格,不过表格刷新时会进行闪烁,根据自己代码决定是否使用此方式刷新表格数据(侵删). 方法一 setInterval ...

AJAX局部刷新数据