前端基础——AJAX
一 简介
AJAX(Asynchronous Javascript And XML),即AJAX = 异步JavaScript + XML。AJAX是一种用于创建快速动态网页的技术。
AJAX两大特点:
- 与服务器异步交互
- 浏览器页面局部刷新:在不重新加载整个网页的情况下,对网页的某部分进行刷新。
同步交互和异步交互:
同步交互:客户端发送一个请求后,需要等待服务端响应结束后才能发送第二个请求;
异步交互:客户端发送一个请求后,无需等待服务端响应结束就可以发送第二个请求。
二 AJAX优缺点
优点:
- AJAX使用JavaScript技术向服务器发送异步请求
- AJAX无须刷新整个浏览器页面,便可实现局部刷新
- 相比刷新整个页面,AJAX局部刷新性能更高
缺点:
- AJAX并不适用于所有场景,有些时候还是需要用到同步交互
- AJAX虽然提高了用户体验,但无形中向服务器发送的请求增加来,导致服务器压力增大
- AJAX通过JavaScript技术实现,需要解决不同浏览器之间的兼容性问题
三 AJAX工作原理
四步操作:
- 创建核心对象;
- 使用核心对象打开与服务器的连接;
- 发送请求
- 注册监听,监听服务器响应。
XMLHttpRequest:
- open(请求方式, URL, 是否异步)
- send(请求体)
- onreadystatechange,指定监听函数,它会在xmlHttp对象的状态发生变化时被调用
- readyState,当前xmlHttp对象的状态,其中4状态表示服务器响应结束
- status:服务器响应的状态码,只有服务器响应结束时才有这个东东,200表示响应成功;
- responseText:获取服务器的响应体

前端基础——AJAX的更多相关文章
- 前端之ajax
前端之ajax 本节内容 ajax介绍 原生js实现ajax jquery实现ajax json 跨域请求 1. ajax介绍 AJAX(Asynchronous Javascript And XML ...
- web前端基础知识及快速入门指南
web前端基础知识及快速入门指南 做前端开发有几个月了,虽然说是几个月,但是中间断断续续的上课.考试以及其它杂七杂八的事情,到现在居然一直感觉自己虽然很多前端的知识很眼熟,却也感觉自己貌似也知识在门口 ...
- 第七篇:web之前端之ajax
前端之ajax 前端之ajax 本节内容 ajax介绍 原生js实现ajax jquery实现ajax json 跨域请求 1. ajax介绍 AJAX(Asynchronous Javascri ...
- 前端基础面试题(JS部分)
1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String 值类型:数值.布尔值.null.und ...
- web前端基础学习路线
1.HTML和CSS的基础知识,完成网页的初步设计 2.JavaScript基础知识和DOM.BOM的学习 3.前端基础框架:CSS框架Bootstrap.JavaScript框架jquery的熟悉使 ...
- 前端基础之:JQuery(可编辑版)
前端基础之jquery 一 jQuery是什么? [1] jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. [2] ...
- 进击的Python【第十六章】:Web前端基础之jQuery
进击的Python[第十六章]:Web前端基础之jQuery 一.什么是 jQuery ? jQuery是一个JavaScript函数库. jQuery是一个轻量级的"写的少,做的多&quo ...
- BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js
BAT 前端开发面经 —— 吐血总结 目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...
- 前端第四篇---前端基础之jQuery
前端第四篇---前端基础之jQuery 一.jQuery介绍 二.jQuery对象 三.jQuery基础语法 四.事件 五.动画效果 六.补充each 一.jQuery简介 1.jQuery介绍 jQ ...
随机推荐
- CentOS7 64位下MySQL5.7安装与配置
安装环境:CentOS7 64位 MINI版,安装MySQL5.7 1.配置YUM源 在MySQL官网中下载YUM源rpm安装包:http://dev.mysql.com/downloads/repo ...
- 微信小程序引入md5.js
今天给大家安利一下微信小程序引入md5.js的方法,不多说 md5.js在下面 直接复制到项目的utils/md5.js即可 /* * A JavaScript implementation of t ...
- UVA-127 "Accordian" Patience (模拟)
题目大意:一种纸牌游戏,将52张扑克牌排成一列,每次操作可将一张扑克牌移到它的前一张或前面第三张上当牌的点数或花色匹配时.每次都移动最靠左的扑克牌,并且能移动三格就移动三格.求最终扑克牌状态. 题目分 ...
- MHA-ATLAS-MySQL高可用2
六,配置VIP漂移 主机名 IP地址(NAT) 漂移VIP 描述 mysql-db01 eth0:192.168.0.51 VIP:192.168.0.60 系统:CentOS6.5(6.x都可以) ...
- HALCON之喷码OCR识别案例
一个喷码识别的案例 1 read_image (Image, 'D:/用户目录/Desktop/2.png') 2 3 rgb1_to_gray(Image, Image) 4 5 get_image ...
- Bayes' theorem (贝叶斯定理)
前言 AI时代的到来一下子让人感觉到数学知识有些捉襟见肘,为了不被这个时代淘汰,我们需要不断的学习再学习.其中最常见的就是贝叶斯定理,这个定理最早由托马斯·贝叶斯提出. 贝叶斯方法的诞生源于他生前为解 ...
- iOS笔记之文件读写
最近做的项目中要存储一组图片数据,图片带有name,date等属性,处理办法是讲image图片直接存在沙盒documents文件中,再使用plist文件存储图片属性和image路径. 存入图片: - ...
- 在Google Maps中导出KML文件
教你一招:在Google Maps中导出KML文件 2011-07-11 15:24:49 4819 人阅读 作者:上方文Q 编辑:上方文Q [复制链接] [爆料] Google Earth的一大乐趣 ...
- CUDA Samples: dot product(使用零拷贝内存)
以下CUDA sample是分别用C++和CUDA实现的点积运算code,CUDA包括普通实现和采用零拷贝内存实现两种,并对其中使用到的CUDA函数进行了解说,code参考了<GPU高性能编程C ...
- Julia 语言的一些尝试
前些天发现了Julia 这门编程语言后便决定对其进行一些尝试,便写了下面的小程序,也算是看看这门语言所谓的速度快到底是怎么快法. 整数累加: x= function fff() : global x ...