AJAX原理与步骤
Posted 码匠与HTML5学堂
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了AJAX原理与步骤相关的知识,希望对你有一定的参考价值。
:而今,AJAX技术已经成为javascript的重要组成部分,提到AJAX,最核心的两个词语是“局部刷新”和“异步加载”。在本文当中,主要介绍AJAX是什么以及其操作的基本步骤。
AJAX是四个单词的简写,其中Asynchronous【发音:[eiˈsiŋkrənəs]】即异步的意思,异步的链接可以同时发起多个,并且不会阻止JS代码执行。与之对应的概念是同步,同步的链接在同一时刻只会有一个,并且会阻止后续JS代码的执行,JS必须等待同步链接加载完毕后才能继续执行。AJAX发展到现在,不但可以发起异步链接,也可以发起同步链接。只是异步相对同步用到的更多。
为何有了AJAX
在AJAX出现之前,注册是非常痛苦的一件事,当时互联网刚刚在中国兴起,网络下载速度普遍在十K出头,而且互联网产品都还不是很成熟,当时注册需要填非常多的没有用的项。许多人刚接触电脑,打字很慢。在经历过漫长的填写以后,点完注册会跳到另一个页面,然后就是漫长的等待加载页面。如果此时有一个地方写错了,这个新的页面就会提示你写错了,你可以选择后退重填,但是所有的项都会被清空。如此反复。
出于这样“糟糕”的用户体验影响,AJAX就横空出世了~~~
AJAX的基本步骤
1 创建请求 var xhr = new XMLHttpRequest(); 构造函数实例化
3 发送请求 xhr.send(null);
4 确定后台加载 xhr.onload = function(){}
5 请求返回的数据 xhr.responseText;
AJAX请求数据 实例
var xhr = new XMLHttpRequest();
var url = 'h5course.json';
xhr.open('get', url, true);
xhr.send(null);
xhr.onload = function(){
var result = JSON.parse(xhr.responseText);
}
欢迎沟通交流~
投稿或建议联系小编 QQ:3042966101
(长按二维码)
以上是关于AJAX原理与步骤的主要内容,如果未能解决你的问题,请参考以下文章