Ajax（Asynchronous JavaScript + XML）不是语音，不是框架，也不能算是一种技术，而是一种模式。通过这种模式实现不重新加载整个页面的情况下，与服务器交换数据并更新部分网页内容。
 
Ajax的核心是XMLHttpRequest。XMLHttpRequest是浏览器内置对象，用于在不更新网页的情况下和服务器通信，获取数据。
 
以下是来自菜鸟教程的示例：
<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script>

function loadXMLDoc()

{

    var xmlhttp;

    if (window.XMLHttpRequest)

    {

        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

        xmlhttp=new XMLHttpRequest();

    }

    else

    {

        // 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("GET","/try/ajax/ajax_info.txt",true);

    xmlhttp.send();

}

</script>

</head>

<body>

<div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div>

<button type="button" onclick="loadXMLDoc()">修改内容</button>

</body>

</html>
XMLHttpRequest.readyState属性存储请求的4个状态：
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
readyState变化时，会触发XMLHttpRequest.onreadystatechange事件。在该事件中处理服务器返回的数据并更新网页。
 
XMLHttpRequest.open(method,url,async)方法的三个参数分别表示：
method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）
通常async传true。如果传false，就没有必要定义onreadystatechange事件，因为程序会在send()处阻塞，可以直接在send()返回后处理response。
 
XMLHttpRequest有两个属性用来获取服务器的响应：
responseText：获得字符串形式的响应数据。
responseXML：获得 XML 形式的响应数据。
 
本文主要是了解下Ajax的基本原理，暂不涉及其他高级用法。
 

Ajax学习笔记——基本原理的更多相关文章

  1. AJax 学习笔记二(onreadystatechange的作用)

    AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...

  2. Ajax学习笔记demo

    AJAX学习 AJAX简介: 全称:Asynchronous JavaScript and XML (JavaScript执行异步网络请求(JS和XML)),通过AJAX可以在浏览器向服务器发送异步请 ...

  3. 基于PHP的AJAX学习笔记（教程）

    本文转载自:http://www.softeng.cn/?p=107 这是本人在学习ajax过程所做的笔记,通过本笔记的学习,可以完成ajax的快速入门.本笔记前端分别使用原生态的javascript ...

  4. ajax学习笔记1

    ajax是什么? ajax即“Asynchronous Javascript + XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术.能够快速的从服务器获得所需数据 ...

  5. AJAX学习笔记

    AJAX不是一种编程语言,AJAX是一种实现网页异步加载的技术,即不刷新网页也能部分的更新网页的内容.如:提交表单信息,通过ajax可以不刷新页面来使得人们明白如何正确的填写信息,判断填写信息的错误或 ...

  6. Jquery ajax 学习笔记

    本人的js & jq 一直是菜鸟级别,最近不忙就看了看ajax方面的知识,文中部分内容参考自这里&这里 之前一直用js写ajax现在基于jq实现方便多了~ $.get & $. ...

  7. Ajax学习笔记2之使用Ajax和XML

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Using Ajax wit ...

  8. Ajax学习笔记1之第一个Ajax应用程序

    代码 <head> <title>An Ajax demo</title> <script src="../js/jquery-1.4.1.js&q ...

  9. Ajax学习笔记(二)

    二.prototype库具体解释 1.prototype库的使用 //导入下载好的prototype.js文件 <script type="text/javascript" ...

随机推荐

  1. 服务器、应用框架、MVC、MTV

    web服务器:负责处理http请求,响应静态文件,常见的有Apache,Nginx以及微软的IIS. 应用服务器:负责处理逻辑的服务器.比如php.python的代码,是不能直接通过nginx这种we ...

  2. 学习笔记TF062:TensorFlow线性代数编译框架XLA

    XLA(Accelerated Linear Algebra),线性代数领域专用编译器(demain-specific compiler),优化TensorFlow计算.即时(just-in-time ...

  3. Linux第六节课学习笔记

    if条件测试语句可以让脚本根据实际情况自动执行相应的命令,可以分为单分支.双分支与多分支. /dev/null为无回收功能的垃圾箱. read是用来读取用户输入信息的命令,-p用来显示提示信息. fo ...

  4. 2.GUI控件的使用 --《UNITY 3D 游戏开发》笔记

    1.Label 控件 编写脚本文件,直接绑定在main camera上 public class labelScript : MonoBehaviour { //设定一个值来接收外部赋值的字符串 pu ...

  5. Java（常用排序算法）

    冒泡排序 比较相邻的元素.如果第一个比第二个大,就交换他们两个,对每一对相邻元素作同样的工作,从开始第一对到结尾的最后一对.在这一点,最后的元素应该会是最大的数. 针对所有的元素重复以上的步骤,除了最 ...

  6. Poj2688cleaningrobot

    这道题让我们求一个地图上的各个点之间的最短路径说白了旅行商问题. 那么我们先用一个裸的BFS求出各个点之间的最短距离,然后我们再枚举各个点的全排列即可 这道题的细节很多,详见注释 上代码~ #incl ...

  7. javaEE REST 基于第三方框架Restlet

    郭晨 软件151 1531610114 1.修改web.xml文件 添加URL模式(<url-pattern>)到Servlet的映射关系 设置Servlet的初始化参数(<init ...

  8. Devexpress之LayoutControl的使用及其控件布局设计

    引言 Devexpress给我们提供了更加美观.更加丰富控件,但在学习和使用的同时经常会遇到诸多麻烦.今天在使用Devexpress的LayoutControl控件进行界面控件的布局设计时遇到了如下的 ...

  9. 2018-2019-2 20165308网络对抗技术 Exp6：信息收集与漏洞扫描

    2018-2019-2 20165308网络对抗技术 Exp6:信息收集与漏洞扫描 实践目标 掌握信息搜集的最基础技能与常用工具的使用方法. 实践内容 (1)各种搜索技巧的应用 (2)DNS IP注册 ...

  10. docker nginx letsencrypt

    https越来越流行了,但免费的证书一般是一年有效期.一般是够用了,但懒人都想一劳永逸, 有个免费证书颁发机构是letsencrypt.它是开源,并且完全免费的,它颁发的证书已经被几乎所有的浏览器所认 ...