指一种创建交互式网页应用的网页开发技术。

AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词。

不是指一种单一的技术,而是有机地利用了一系列相关的技术:

web标准( Standards-Based Presentation )XHTML+CSS的表示,

使用 DOM( Document Object Model )进行动态显示及交互,

使用 XML 和 XSLT 进行数据交换及相关操作,

使用 XMLHttpRequest 进行异步数据查询、检索.

AJAX优点

lAjax在本质上是一个浏览器端的技术
lAjax技术之主要目的在于局部交换客户端及服务器间之数据
l这个技术的主角XMLHttpRequest 的最主要特点,在于能够不用重新载入整个版面来更新资料,也就是所谓的Refresh without Reload(轻刷新)
l与服务器之间的沟通,完全是透过Javascript 来实行
l使用XMLHttpRequest 本身传送的数据量很小,所以反应会更快,也就让网络程式更像一个桌面应用程序
lAJAX 就是运用Javascript 在后台悄悄帮你去跟服务器要资料,最后再由Javascript 或DOM 来帮你呈现结果,因为所有动作都是由Javascript 代劳,所以省去了网页重载的麻烦,使用者也感受不到等待的痛苦

1.GET方式

1.1设置参数

xhr.open("GET", "GetAreasByAjax.ashx?isAjax=1", true);

1.2GET方式请求可以设置浏览器不使用缓存
xhr.setRequestHeader("If-Modified-Since",
"0");

1.3发送: xhr.send(null);//GET方式

2.POST方式:
       1.1设置参数:xhr.open("POST", "GetAreasByAjax.aspx", true);
       1.2添加请求头:xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

1.3发送:xhr.send("isAjax=1&na=123");//POST方式

异步使用XMLHttpRequest对象

异步使用XMLHttpRequest对象时,必须使用:onreadystatechange事件。

使用模式应该是:

1.创建该对象;-new
2.设置readystatechange事件触发一个回调函数; -onreadystatechagne
3.打开请求;-open
4.发送请求;-send

注:在回调函数中检查readyState属性,看数据是否准备就绪(是否等于4)。

u如果没有准备好,隔一段时间再次检查。因为数据没有下载完时,我们无法使用它的属性和方法。
u如果已经准备好,就继续往下执行;
lreadyState属性

readyState属性指出了XMLHttpRequest对象在发送/接收数据过程中所处的几个状态。XMLHttpRequest对象会经历5种不同的状态。

•0:未初始化。对象已经创建,但还未初始化,即还没调用open方法;
•1:已打开。对象已经创建并初始化,但还未调用send方法;
•2:已发送。已经调用send 方法,但该对象正在等待状态码和头的返回;
•3:正在接收。已经接收了部分数据,但还不能使用该对象的属性和方法,因为状态和响应头不完整;
•4:已加载。所有数据接收完毕
lAJAX请求服务器时如果服务器出错了怎么办?
l编程常见错误
•XMLHttpRequest大小写不正确;
•多写了对圆括号:

正确:xHRObject.onreadystatechange =getData;

错误:xHRObject.onreadystatechange =getData();

必须弄清楚,在JavaScript中:

•函数名后如果有圆括号,意思就是将函数的返回值赋给等号左边的变量;
•没有圆括号,是将函数本身赋给等号前的变量。
 

什么是AJAX? AJAX:”Asynchronous JavaScript and XML”中文意思:异步JavaScript和XML。的更多相关文章

  1. AJAX—AJAX基础

    AJAX简介 什么是AJAX AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Javascript和XML”.即使用Javascript语言与服务器进行异 ...

  2. Ajax(Asynchronous JavaScript )and xml

    JavaScript的两种任务执行模式--同步(synchronous)和异步(Asynchronous) 同步模式 JavaScript的执行环境是单线程的,意味着一次只能执行一个任务,如果有多个任 ...

  3. AJAX(Asynchronous JavaScript And XML)

    AJAX(Asynchronous JavaScript And XML):异步的javascript和xml技术 作用:在不刷新整个页面的情况下,通过XMLHttpRequest向后台偷偷发起请求, ...

  4. Ajax技术 - (Asynchronous JavaScript + XML)

    Ajax Ajax = 异步JavaScript和XML,Ajax是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新.可以再网页不重新加载的情况下, ...

  5. 【JavaScript】AJAX总结(异步JavaScript和XML)

    AJAX介绍 通过 AJAX,你可以创建更好.更快以及更友好的 WEB 应用程序. AJAX 基于 JavaScript 和 JavaScript的XMLHttpRequest对象. AJAX 应用程 ...

  6. HtmlUnit爬取Ajax动态生成的网页以及自动调用页面javascript函数

    HtmlUnit官网的介绍: HtmlUnit是一款基于Java的没有图形界面的浏览器程序.它模仿HTML document并且提供API让开发人员像是在一个正常的浏览器上操作一样,获取网页内容,填充 ...

  7. ajax 异步请求webservice(XML格式)

    function callAjaxWebservice(){ alert("call ajax"); try { $.ajax({ type: "POST", ...

  8. ajax异步 —— javascript

    目录 ajax是什么 原生ajax jquery ajax ajax跨域 ajax是什么 作用:不必重新加载整个页面,更新部分页面内容. 大概使用过程:通过后台提供的数据接口,ajax获取数据,动态修 ...

  9. How to make an HTTP request 异步 JavaScript 和 XML

    https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started In order to make an HTTP request to th ...

  10. Ajax在jQuery中的应用---加载异步数据

    Ajax是Asynchronous JavaScript and XML的缩写,其核心是通过XMLHttpRequest对象,以一种异步的方式,向服务器发送数据请求,并通过该对象接收请求返回的数据,从 ...

随机推荐

  1. 条件注释判断IE版本

    在学习Bootstra的时候看到这么一句话, <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media ...

  2. 在Github发布自己的compile包

    Android入门到转行做服务员--在Github发布自己的compile包 2017-12-05 15:27:10 这是一粒代码发布的第一篇博客,一粒代码从事android开发,近期打算开始搞搞博客 ...

  3. Awk,Cat,Head分析Nginx日志常用命令

    Nginx 日志分析   1.根据访问IP统计UV   awk '{print $1}'  access.log|sort | uniq -c |wc -l   2.统计访问URL统计PV   awk ...

  4. 获取串口映射的COM端口号

    背景:近期由于项目需要,需要操作短信猫,当短信猫插入电脑后,会根据当前PC状况,映射COM口,这里需动态获取短信猫映射的COM端口号. 编程语言C#: 具体代码如下 public enum Hardw ...

  5. JS 中对变量类型的五种判断方法

    5种基本数据类型:undefined.null.boolean.unmber.string 复杂数据类型:object. object:array.function.date等 方法一:使用typeo ...

  6. c++用类写栈和队列的简单基本操作(实验)

    继续更文.这次用类来写栈和队列,都是用数组模拟的: 以下是栈和队列的定义: 然后分别是栈和队列的类: 完整代码贴上: 栈 //使用类来定义栈 class ZHAN { public: STACK s; ...

  7. linux个人情况总结

    linux主文件夹打不开 killall Nautilus linux下codeblocks编译文件权限不够,将文件建立在用户的目录下

  8. MySQL数据库数据信息迁移

    环境内核信息: [root@zabbix-01 ~]# uname -a Linux lodboyedu-01 2.6.32-696.el6.x86_64 #1 SMP Tue Mar 21 19:2 ...

  9. Linux----CentOS-7搭建免流服务器

    本次实验采用腾讯云服务器:https://cloud.tencent.com/ 大学生身份的可以看看有没有什么活动购买 其他身份的78一个月 关于腾讯云服务器的使用可以看看腾讯云的使用手册 本博客涉及 ...

  10. Bootstrap全局CSS样式之排版

    Bootstrap能全然友好的支持html5的文本元素,这里不再赘述,详细可參考我还有一篇文章<html的文本元素总结>,这里主要针对Bootstrap封装好的CSS文本样式做一下汇总. ...