Ajax初涉

前端之家收集整理的这篇文章主要介绍了Ajax初涉前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

学习Ajax是在住院期间开始的,对于Ajax的所有认识就是王兴魁老师的实战视频,缺乏一个宏观把控,回家之后通过查资料,对于Ajax除了具体的细节使用,有了一个更加宏观的认识,总结如下。

Ajax是什么?

首先声明AJAX不是一种新的编程语言,而是一种用于创建更好更快以及交互性更强的Web应用程序的技术,也可以说是一种创建快速动态网页的技术。

AJAX的英文表示即“AsynchronousJavascript AndXML”(异步JavaScript和XML),即可以用一个公式理解为“AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。”


为什么使用Ajax?

“同步”和“异步”是什么意思?

所谓“同步”当用户页面发起请求时,就要进行整个页面的刷新,刷新快慢取决于服务器的处理快慢。在这个过程中用户必须得等待,不能进行其他操作。也就是同步的方式。客户端和服务端传递了很多不需要的数据。效率低,用户体验差。采用ajax的页面,也就是“异步”可以实现页面的局部更新,而不是整个页面的更新;并且发起请求后,用户还可以进行页面上的其他操作。这就是异步的方式。客户端和服务端间只传递需要的数据,效率高,用户体验性好。

如图所示,是传统网页和使用了Ajax之后的网页访问工作原理对比:


对比传统Web应用模式以及AJAX应用模式,不同点如下:

(1)ajax可以在不刷新页面的情况下实现对服务器的访问,而传统模式访问的实质则需要从一个页面跳转到另一个页面,实现对数据的访问。

(2)从最终服务器返回内容的角度看,传统模式返回的是页面,占用资源多,而ajax返回的是数据,即不刷新页面的情况下,仅仅再窗口的某个位置返回一个特定的数据。

(3)传统方式访问即是如上所说的“同步”,而ajax访问方式则是“异步”,效率更高,可在不刷新页面的情况下执行多个操作。

Ajax在那些方面起作用?

在王兴魁老师的课程里,像动态加载地图就是一个很好的例子。这就像我们在视频例子中在html页面<body>部分里预留的<div></div>标签中填写的内容一样。通过在网上查询资料,了解ajax常用的几个功能如下:

1.动态校验(注册账号时验证邮箱是否已被注册

2.自动完成

3.级联(类似输入“省”之后,自动匹配“市和县”)

4.动态提示

5.自动保存

其实最为常用的地方在百度搜索文本框里,我们每打一个字就会为我们匹配下拉列表中的内容,这肯定是AJAX。


Ajax如何使用?

灵活使用AJAX的前提是熟练掌握javascript技术,这是基础。

AJAX技术通过视频的学习和网上的资料,它是嵌套在js中的代码,通过类似于页面中onclick事件触发,从而实现对服务器的访问。

而Ajax 的核心是JavaScript 对象 XMLHttpRequest,之前在学习XML和Asp.net的过程中接触过XMLHttpRequest,不是很详细的认识,这次通过AJAX对于它的认识更加深入了,对于XMLHttpRequest会在下一篇博客中总结。

总结:

在对AJAX先有了一个宏观认识之后,再学习就会很容易了。

原文链接:https://www.f2er.com/ajax/162536.html

猜你在找的Ajax相关文章