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

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. Windows下根据端口号查找进程并关闭

    经常用到,但是总记不住命令,备忘一下…… netstat -aon|findstr "8080"  找到进程号 tasklist|findstr "7200"  ...

  2. openstack pike 单机 一键安装 shell

    #openstack pike 单机  centos 一键安装 shell #openstack pike 集群高可用  安装部署 汇总 http://www.cnblogs.com/elvi/p/7 ...

  3. haproxy1.7编译安装配置

    #haproxy1.7编译安装配置#高可用.负载均衡 使用 #haproxy1.7编译安装配置 #centos7 x86_64 #高可用.负载均衡 使用 #下载 #http://www.haproxy ...

  4. 实践作业3DAY1

    今天,老师又布置了新的学习任务,关于白盒测试.感觉黑盒测试,我们用的比较多,白盒测试就相对陌生了.上课的时候老师虽然也进行了一定的点拨,外加我们学习了SPOC视频,但是并没有看到什么具体的项目,所以实 ...

  5. nyoj 63 小猴子下落 思维

    nyoj 63 小猴子下落 题目链接: http://acm.nyist.net/JudgeOnline/problem.php?pid=63 思路: 不需要用指针创建二叉树,也不需要用数组来模拟二叉 ...

  6. php加密字符串超时不可解密

    <?php/** * 加密字符串在指定时间内解密有效 * @param  [type]  $string    明文字符串 * @param  string  $operation 解密值为DE ...

  7. php简单实现发微博动态

    首先,肯定是注册成为开发者新浪微博开放平台 选择网站应用,填写一些基本信息 填完后在'我的应用'中,会看到刚创建的应用信息,我们只是简单的测试一下,所以其他复杂的注册信息都不用填写,有这些就够了 很重 ...

  8. spring mvc 复杂参数注入

    过了这么久,又重新把博客拾起来了 来上海工作也已经有将近两周的时间了, 今天在整理项目的时候,遇到了一个关于参数注入的问题 背景: 我的开发前台用的是extjs4,在对后台spring mvc提交表单 ...

  9. phpstorm快捷键记录

    快捷键记录 Ctrl + N 按类名查找Ctrl + Shift + N 按文件名查找,快速查找文件Ctrl + Shift+Alt+N 根据函数名查找Ctrl + F 当前文件查找Ctrl + Sh ...

  10. 组件嵌套时报:Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.

    在组件嵌套的过程中,报了一个错误: 这里报错的原因是:vue的组件(模板)只能有一个根节点,即.vue文件中的<template>标签下只能有一个子元素. 因此,建议大家在写.vue组件的 ...