从零开始学习Ajax：Web开发技术实战！

Posted 2021-04-15 达内web前端培训

划重点

说到Ajax，你会想到什么？如果你还对Ajax了解甚少，详细看本文耽美如何替你答疑！

何为AJAX？

AJAX(Asynchronous javascript and XML)是一种创建交互式网页应用的网页开发技术。AJAX使用JavaScript编写的 XMLHttpRequest 对象与与服务器通信。使用XMLHttpRequest，浏览器向Web 服务器发送异步HTTP请求，页面无需重载即可与Web 服务器交换数据。

AJAX技术的标准实现是XMLHttpRequest(简称XHR)对象。XHR可以调用类似jQuery等相关JS库例。下面给一个示例代码，来演示如何使用XHR：

1. 创建XMLRequest对象

if (window.XMLHttpRequest) {

　　xhr = new XMLHttpRequest();

　　} else if (window.ActiveXObject) {

　　xhr = new ActiveXObject("Microsoft.XMLHTTP");

　　}

2. 构造浏览器向服务器发送的异步HTTP请求URL

xhr.open(

　　"GET",

　　"my-dynamic-content.jsp?id="

　　+encodeURI(myId),

　　true

　　);

3. 指定回调函数接收服务器端响应

xhr.onreadystatechange = function(){

　　processReqChange(req);

　　}

4.浏览器向服务器端发送XRH请求

xhr.send(null);

如果使用同步方式，待客户端请求发送后，要做的是等待服务器端的响应。有时是干等，因为服务器因服务忙，或者网络延迟原因响应很慢。而使用异步AJAX技术，我们就可以干点别的事情了，而不必干等，因为AJAX指定回调函数随时接收服务器的响应，然后通知我们。

如果您想了解更多细节， 请参见XHR对象的更多属性信息：

何谓HTTP？

XHR的基础是HTTP协议，因此，充分熟悉HTTP协议有助于更加有效利用AJAX技术。HTTP协议的主要特点如下：

• 　

• HTTP是一种无状态的请求-响应协议

• 无论是请求，还是响应，都包含了Header，属于文本类型。

• 只有POST请求才包含Body。

• 所谓请求是指定义一个动词与方法。

• 通过在Header文件设置Content-type指定请求、响应Mime类型。

• 
  

相比于其它HTTP方法，我们使用GET和POST的概率是99%。HTTP方法列表如下：

REST是时下非常流行的Web Service技术，常见的一个应用是地图服务，常用的HTTP的方法如下：

正确设定请求与响应的Mime类型，是网页正常显示的关键因素之一。Mime类型列表如下：

同学们，学会了AJAX技术了吗？熟练掌握，不懂的文末右下角留言咨询达妹哦！

* 本文来源：天极网

*  免责声明：转载文章和图片均来自公开网络，版权归作者本人所有，推送文章除非无法确认，我们都会注明作者和来源。如果出处有误或侵犯到原作者权益，请与我们联系删除或授权事宜。

- END -

报名达内5月免费试听课程

学习最新热门技术

找一份自己满意的高薪工作

免费课程报名方式

1、点击阅读原文

好消息，平安产险承保达内学员平安就业教育保障险，帮助达内学员解决就业的后顾之忧，只要你是达内学员，就可以在达内各中心参保，经过达内全日制课程的学习之后，如果超过3个月未就业，可以再到达内免费学习同一课程，学习期超过50个学习日的，可申请平安产险理赔，让你毫无后顾之忧！

达内web前端

60万学员的共同选择

QQ咨询：2421473554

点击下方“阅读原文”抢web前端免费课程名额 ！