你真的完全理解ajax吗?
2019-06-14 23:25
246 查看
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_43815756/article/details/92019394
首先,一句话了解ajax,就是用通过ajax做数据交互,既然我们了解了ajax的作用,下面我们通过来仔细了解ajax。
1.ajax原理:通过XmlHttpRequest对象来向服务器发送异步请求,从服务器获得数据,然后通过JavaScript来操作数据,从而达到更新页面的效果。
简而言之:用于在后台与服务器交换数据,达到局部刷新的效果。
2.ajax的核心:XmlHttpRequest对象
3.ajax的加载特点:异步加载,局部刷新
ajax加载有两种:同步加载和异步加载
同步加载:一次执行一个,前一个没有一个执行完成,后一个不能开始
异步加载:一次执行一堆,前一个没有执行完成,后一个也能开始
4.ajax的好处:
①:最大的优点就是页面刷新,在页面与服务器通信时,用户体验会非常好,节约宽带
②:在使用异步操作时,具有更加迅速的响应能力,不需要打断用户操作
切记:涉及到ajax的访问时,千万不能使用文件协议的方式打开文件
下面是关于ajax的创建及访问。
//创建XmlHttpRequest对象--->相当于创建了一个http请求,主要用于和服务器交换数据 var xhr=new XMLHttpRequest(); //2.open(规定的请求类型get/post,URL,是否异步请求(默认是异步))-->相当于与服务器建立了特定端口的链接 xhr.open('get','./test.txt'); //3.将请求发送到服务器开始请求 //send(string--->只能在post方式请求的时候) xhr.send(); //4.等待响应,需要事件机制去通知他 //这个事件只要状态该变了就会触发 xhr.onreadystatechange=function () { console.log(this.readyState);//状态的数值:2,3,4 //判断响应已经就绪时,就可以拿到想要的数据 if(this.readyState!=4)return; console.log(this.responseText);//拿到响应的文本 document.getElementsByTagName("body")[0].innerHTML=this.responseText; }
今天就先分享下ajax的基本概念吧,后面继续分享关于ajax的知识点。
相关文章推荐
- JAVA EE 项目常用知识 之AJAX技术实现select下拉列表联动的两种用法(让你真正理解ajax)
- 【Android小品】从使用出发完全理解View(ViewGroup)测量机制,并分析部分源码(修复图片)
- 完全理解 Python 迭代对象、迭代器、生成器
- 对Ajax的一些基本理解
- 完全理解Android中的RemoteViews
- Android异步消息处理机制完全解析,带你从源码的角度彻底理解
- Android Volley完全解析(四),带你从源码的角度理解Volley
- 看图理解:普通交互方式和Ajax交互方式区别
- 十步完全理解SQL
- 十步完全理解SQL
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年,我们被耍过的bug——has
- 十步完全理解SQL
- 十步完全理解SQL
- 十步完全理解 SQL
- Android AsyncTask完全解析,带你从源码的角度彻底理解
- Android事件分发机制完全解析,带你从源码的角度彻底理解(全)
- Android事件分发机制完全解析,带你从源码的角度彻底理解(上)
- Android事件分发机制完全解析,带你从源码的角度彻底理解(上)
- 有关微服务的多种解释与理解【摘自网络】,不完全赞同的文章
- Ajax简单理解