1.Ajax概念
- AJAX即Asynchronous Javascript And XML(异步JavaScript和XML),是改善用户体验的网页开发技术
传统交互方式:
缺点:
发送的请求是一个同步请求,销毁页面就不能继续操作
修改的数据仅仅是页面中一小部分,然后响应的却是整个完整页面,浪费网络传输资源
Ajax交互方式:
优点:
异步请求,发送请求的同时还可以继续操作页面。页面不销毁;
返回部分数据,减少不必要的数据承传输,减少网络资源。页面不刷新,而是更新页面部分数据。
总结:
ajax出现的缘由:更好的提升用户的体验,以及提升服务器的效率,减少网络中不必要的数据的传送。
1.Ajax使用场景
- 自动提示:百度输入框自动提示功能;【演示】
- 用户名重复检查:用户注册时,检查用户名是否存在,及时给用户反馈;【代码实现】
- 邮箱提示:WEB版邮箱系统,当有新邮件到达服务器,浏览器不用刷新页面也知道是否有新邮件;
- 无刷新分页:显示数据列表,用户点击下一页数据,整个页面不会刷新,只把下一页的数据更新到页面中;
- 购物车:用户点击添加到购物车后,能继续进行其他操作,而购物车的数据存储服务器端;
- 用户登录:用户登录的数据通过AJAX传输到后台,如果登录失败直接在当前登录页面提示用户,而不用刷新整个页面;
- 视频网站,商城网站【淘宝】;
- 股票网站;
…
秘诀:浏览器网站的时候,留心观察很多页面未刷新,但是页面中的内容被更改了,这些都是AJAX使用场景; 99%的网站都会用到Ajax;
如何获取Ajax对象 - Ajax实质
- 写ajax代码就是写js代码;
(1) a标签
(2) 浏览器地址栏
(3) Form表单
(4) Java 语言:涉及到了所有的语言
(5) Js也是计算机命令:纯面向对象:js也是可以向后台发送请求的 - 计算机命令:核心就要看到在用计算机命令处理数据
- 语法学习: num = 10
- 数据类型:number string boolean Object
- 流程控制:顺序,选择,循环
- 函数:?
- 面向对象
- 静态属性
- 动态行为
- 学习ajax其实是学习使用ajax(XMLHttpRequest对象)对象发异步请求;
- 利用Ajax发请求的实质:通过浏览器Ajax对象发送异步请求,将响应的数据局部更新到页面;