ajax基础介绍
来源:互联网 发布:联合国安理会知乎 编辑:程序博客网 时间:2024/06/08 13:42
前导:Ajax通过js语法的异步网络请求技术,实现页面局部更新,之前所使用的的form表单、a标签都是全部更新页面
异步:在执行到耗时操作时,先去执行其他代码,等耗时操作处理完毕后,再通过回调函数处理耗时操作
同步:在执行到耗时操作时,会一直等待直到操作处理完毕,再去执行其他代码。
1、如何创建ajax对象
1)创建一个对象,检查浏览器是否支持XMLHttpRequest对象,其实现在所有浏览器都支持XMLHttpRequest对象,除了该死的IE5,IE6,如果不支持的话,创建ActiveXObject对象,对!我们做这一步就是为了IE5、6小婊砸
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject(‘Microsoft.XMLHTTP’);
2)配置请求参数,第一个参数是请求方法(GET/POST,浏览器请求方法不只这两种,只不过其他情况不适用),第二个参数是请求路径,如果GET请求的接口需要接口参数,则只需把接口参数拼接在接口之后即可,接口和参数之间使用“?”链接,参数和参数之间使用“&”链接,key值和value值之间使用“=”链接,如果GET请求中的参数有可能出现中文,为了增强代码健壮性,我们需要使用encodeURI()函数对中文进行编码操作第三个参数是否异步请求(true/false),默认为true,表示异步请求
xhr.open(‘GET’,url,true);
3)发送请求,因为我们这次是GET请求,请求参数已经拼接在url里面所以不需要再次传入,所以在send()参数位置传入null,表示没有任何数据,如果请求方式为POST,send()方法里面传入要传送的数据
xhr.send(null);
4)监听一个请求事件,收到浏览器的返回信息就会触发一次事件
xhr.onreadystatechange = function( ){
//判断条件表示请求数据已加载完毕,服务器已成功处理请求
if(xhr.readyState == 4 && xhr.status == 400){
console.log(xhr.responseText);
}
}
- AJAX技术基础介绍
- AJAX技术基础介绍
- AJAX 基础介绍
- AJAX技术基础介绍
- AJAX技术基础介绍
- ajax基础介绍
- ajax学习笔记----基础介绍
- Ajax技术基础__AJAX技术介绍
- Ajax基础 (十一)---代码测试,资源及框架介绍
- AJAX介绍
- AJAX介绍
- Ajax介绍
- AJAX 介绍
- ajax 介绍
- AJAX介绍
- AJAX介绍
- AJAX介绍
- ajax介绍
- CF808C
- 空了一天,今天第二十四天
- NOI2017题解(挖坑待填)
- (十三)中介者模式详解(玄幻版)
- Mysql 优化——分析表读写和sql效率问题
- ajax基础介绍
- Linux(64位)下OpenBabel 2.4.1、python2.7和Ipython实战(一)
- nyoj67——三角形面积
- linux下mysql的安装遇到本地连接不上怎么办
- qgis 软件下载和图层管理和操作
- 欢迎使用CSDN-markdown编辑器
- 校内胡测--8.26.2017 超级树
- tcp窗口滑动以及拥塞控制
- 滴滴出行