AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新，即可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

通过 jQuery AJAX 方法，您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

创建 XMLHttpRequest 对象（XMLHttpRequest 对象用于和服务器交换数据。）的语法：

var xmlhttp;

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

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

}

向服务器发送请求：

将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：

xmlhttp.open("GET","test1.txt",true);

xmlhttp.send();

请使用 POST 请求：

无法使用缓存文件（更新服务器上的文件或数据库）

向服务器发送大量数据（POST 没有数据量限制）

发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠。

一个简单的get请求：

<html>

<head>

<script type="text/javascript">

var xmlhttp;

if(window.XMLHttpRequest){

xmlhttp=new XMLHttpRequest();

}

else{

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

}

xmlhttp.onreadystatechange=function(){

if(xmlhttp.readyState==4&&xmlstatus==200){

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

xmlhttphttp.open("GET","/ajax/demo_get.asp",true);

xmlhttp.send();

</script>

</head>

<body>

<h2>AJAX</h2>

<button type="button" onclick="loadXMLDoc()">请求数据</button>

<div id="myDiv"></div>

</body>

</html>

一个简单的post请求：

<html>

<head>

<script type="text/javascript">

function loadXMLDoc()

{

var xmlhttp;

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

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

}

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 && xmlhttp.status==200)

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

xmlhttp.open("POST","/ajax/demo_post.asp",true);

xmlhttp.send();

}

</script>

</head>

<body>

<h2>AJAX</h2>

<button type="button" onclick="loadXMLDoc()">请求数据</button>

<div id="myDiv"></div>

</body>

</html>

Ps：

如果需要像 HTML 表单那样 POST 数据，使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定希望发送的数据：

xmlhttp.open("POST","ajax_test.asp",true);

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

xmlhttp.send("fname=Bill&lname=Gates");

url - 服务器上的文件

open() 方法的 url 参数是服务器上文件的地址：

xmlhttp.open("GET","ajax_test.asp",true);

XMLHttpRequest 对象如果要用于 AJAX 的话，其 open() 方法的 async 参数必须设置为 true：

xmlhttp.open("GET","ajax_test.asp",true);

服务器响应

如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

onreadystatechange 事件

当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 readyState 改变时，就会触发 onreadystatechange 事件。readyState 属性存有 XMLHttpRequest 的状态信息，从0到4。0: 请求未初始化；1: 服务器连接已建立；2: 请求已接收；3: 请求处理中；4: 请求已完成，且响应已就绪。 Statu s：200表示ok，404表示未找到页面。

ajax基础1的更多相关文章

  1. 史上最全的Ajax基础详解

    同步请求和异步请求 先解释一下同步和异步的概念: 同步是指:发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式. 异步是指:发送方发出数据后,不等接收方发回响应,接着发送下个数据包的通讯 ...

  2. 【Java EE 学习 31】【JavaScript基础增强】【Ajax基础】【Json基础】

    一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使 ...

  3. Ajax基础知识《一》

    对于网站开发人员,一定不会陌生的Ajax技术,本篇就让我们认识一下它,或许在日后的开发过程中我们就可以使用到.Ajax在那方面使用的比较多呢?答案:表单注册,传统的表单注册,有时需要填写大量的信息,当 ...

  4. Ajax基础2

    什么是服务器 网页浏览过程的分析 如何配置自己的服务器程序(AMP) 什么是Ajax 无刷新数据读取 异步,同步 Ajax基础(2) 使用Ajax 基础请求显示txt的文件 字符集编码 缓存,阻止缓存 ...

  5. ajax基础语法、ajax做登录、ajax做用户名验证是否可用、ajax做关键字查询动态显示、ajax做用表格显示数据并增加操作列

    AJAX: AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.   ...

  6. Ajax基础--JavaScript实现

    ajax原理 1.ajax 即“Asynchronous JavaScript and XML”(异步 JavaScript 和 XML),也就是无刷新数据读取. 通俗地讲就是:AJAX 通过在后台与 ...

  7. jQuery基础---Ajax基础教程（二）

    jQuery基础---Ajax进阶 内容提纲: 1.加载请求 2.错误处理 3.请求全局事件 4.JSON 和 JSONP 5.jqXHR 对象 发文不易,转载请注明出处! 在 Ajax 基础一篇中, ...

  8. jQuery基础---Ajax基础教程

    jQuery基础---Ajax基础 内容提纲: 1.Ajax 概述 2.load()方法 3.$.get()和$.post() 4.$.getScript()和$.getJSON() 5.$.ajax ...

  9. Ajax基础知识（二）

    接上一篇  Ajax基础知识(一) 在上一篇博客里,抛弃了VS中新建aspx页面,拖个button写上C#代码的方式.使用ajax的方式,异步向服务器请求数据.我们让服务器只简单的返回一个" ...

  10. 原生AJAX基础讲解及兼容处理

    原文:原生AJAX基础讲解及兼容处理 AJAX = Asynchronous JavaScript and XML (异步的JavaScript和XML). AJAX不是新技术 ,但却是热门的技术.它 ...

随机推荐

  1. Windows下USB磁盘开发系列二：枚举系统中所有USB设备

    上篇 <Windows下USB磁盘开发系列一:枚举系统中U盘的盘符>介绍了很简单的获取系统U盘盘符的办法,现在介绍下如何枚举系统中所有USB设备(不光是U盘). 主要调用的API如下: 1 ...

  2. 一次爬虫实践学习(C#)

    我们经常浏览网页,有时候看到一些精美的图片,想下载下来保存,但是太多,如果一张一张的下载,那太费时了:如果你喜欢看书,看小说,那么浏览小说网站是常有的事,但是有时候我们不能联网,比如农村老家,如果还想 ...

  3. 【转载】Log4j详细使用教程

    本文由林炳文Evankaka创作,出处http://blog.csdn.net/evankaka 日志是应用软件中不可缺少的部分,Apache的开源项目Log4j是一个功能强大的日志组件,提供方便的日 ...

  4. php常用数组函数回顾一

    数组对于程序开发来说是一个必不可少的工具,我根据网上的常用数组函数,结合个人的使用情况,进行数组系列的总结复习.里面当然不只是数组的基本用法,还有相似函数的不同用法的简单实例,力求用最简单的实例,记住 ...

  5. Is the Information Reliable? -POJ2983差分约束

    Time Limit: 3000MS Memory Limit: 131072K Description The galaxy war between the Empire Draco and the ...

  6. MySQL为什么需要一个主键

    主键 表中每一行都应该有可以唯一标识自己的一列(或一组列). 一个顾客可以使用顾客编号列,而订单可以使用订单ID,雇员可以使用雇员ID 或 雇员社会保险号. 主键(primary key) 一列(或一 ...

  7. socket(二)

    作用域 1 2 3 if 1 == 1:  ​   name = 'alex' print(name) python中是没有块儿作用域的,所以python可以输出name java/c中有块级作用域, ...

  8. 财务报表 > 现金流表的直接法，间接法，Cash Flow from Operating Activites

    经营活动现金流量 Cash Flow from Operating Activites 是指企业投资活动和筹资活动以外的所有的交易和事项产生的现金流量.它是企业现金的主要来源. 1. 直接法经营活动现 ...

  9. 2017年1月1日 星期日 --出埃及记 Exodus 21:27

    2017年1月1日 星期日 --出埃及记 Exodus 21:27 And if he knocks out the tooth of a manservant or maidservant, he ...

  10. 【树莓派】树莓派使用4G模块上网

    想了解一下树莓派通过4G网络模块通信如何实现,看到这篇文章(http://www.lxway.com/95811506.htm),准备接下来有机会实践一下,先留存学习: 一.4G Luci配置 1. ...