一、Ajax概述

1.什么是同步,什么是异步

同步现象:客户端发送请求到服务器端,当服务器返回响应之前,客户端都处于等待 卡死状态

异步现象:客户端发送请求到服务器端,无论服务器是否返回响应,客户端都可以随 意做其他事情,不会被卡死

2.Ajax的运行原理

页面发起请求,会将请求发送给浏览器内核中的Ajax引擎,Ajax引擎会提交请求到 服务器端,在这段时间里,客户端可以任意进行任意操作,直到服务器端将数据返回 给Ajax引擎后,会触发你设置的事件,从而执行自定义的js逻辑代码完成某种页面1 功能。

二、js原生的Ajax技术

js原生的Ajax其实就是围绕浏览器内内置的Ajax引擎对象进行学习的,要使用js原 生的Ajax完成异步操作,有如下几个步骤:

1)创建Ajax引擎对象

2)为Ajax引擎对象绑定监听(监听服务器已将数据响应给引擎)

3)绑定提交地址

4)发送请求

5)接受响应数据

注意:

  • send()方法是封装请求的数据的,get请求或者post的无参请求时候使用xmlHttp.send(),post有参请求的时候 为 xmlHttp.send("name=wangwu");
  • get请求时候,参数和链接一起写在open中例如:xmlHttp.open("GET","/WEB22/ajaxServlet?name=lisi",true);
  • 如果是post提交在发送请求之前设置一个头

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

 

三、Jquery的Ajax技术

jquery是一个优秀的js框架,自然对js原生的ajax进行了封装,封装后的ajax的操 作方法更简洁,功能更强大,与ajax操作相关的jquery方法有如下几种,但开发中 经常使用的有三种

1)$.get(url, [data], [callback], [type])

2)$.post(url, [data], [callback], [type])

其中:

url:代表请求的服务器端地址

data:代表请求服务器端的数据(可以是key=value形式也可以是json格式)

callback:表示服务器端成功响应所触发的函数(只有正常成功返回才执行)

type:表示服务器端返回的数据类型(jquery会根据指定的类型自动类型转换)

常用的返回类型:text、json、html等

3)$.ajax( { option1:value1,option2:value2... } ); ---- 以后在掌握

常用的option有如下:

async:是否异步,默认是true代表异步

data:发送到服务器的参数,建议使用json格式

dataType:服务器端返回的数据类型,常用text和json

success:成功响应执行的函数,对应的类型是function类型

type:请求方式,POST/GET

url:请求服务器端地址

  • 其中jquery的ajax项目使用的是最多,也是最推荐使用的。  1)简单  2)兼容性更好

ajax的两种使用方式的更多相关文章

  1. Ajax的两种实现方式

    //ajax的jquery实现 function aclick(){//alert("測试一");var name = $("#userName").val() ...

  2. Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式

    //1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...

  3. ajax的两种应用方式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. Struts2实现ajax的两种方式

    基于Struts2框架下实现Ajax有两种方式,第一种是原声的方式,另外一种是struts2自带的一个插件. js部分调用方式是一样的: JS代码: function testAjax() { var ...

  5. Ajax中的get和post两种请求方式的异同

    Ajax中我们经常用到get和post请求.那么什么时候用get请求,什么时候用post方式请求呢? 在做回答前我们首先要了解get和post的区别.   1. get是把参数数据队列加到提交表单的A ...

  6. Ajax的get和post两种请求方式区别

    Ajax的get和post两种请求方式区别 (摘录):http://ip-10000.blog.sohu.com/114437748.html 解get和post的区别. 1. get是把参数数据队列 ...

  7. easyui datagride 两种查询方式

    easyui datagride 两种查询方式function doReseach() { //$('#tt').datagrid('load', { // FixedCompany: $('.c_s ...

  8. 斑马打印机客户端GET和POST,以及后端两种打印方式。

    斑马打印机客户端GET和POST,以及后端两种打印方式. 背景环境:打印机安装在客户端外网.当用户登录时,通过ajax取服务器数据,返回打印机命令,然后客户端通过JS发送给斑马打印机. 1.使用Get ...

  9. Web APi之认证(Authentication)两种实现方式【二】(十三)

    前言 上一节我们详细讲解了认证及其基本信息,这一节我们通过两种不同方式来实现认证,并且分析如何合理的利用这两种方式,文中涉及到的基础知识,请参看上一篇文中,就不再叙述废话. 序言 对于所谓的认证说到底 ...

随机推荐

  1. github发布博客

    创建github项目:  名字为:{{你的帐号}}.github.io clone项目,创建并提交推送一个index页面 如: <!DOCTYPE html> <html> & ...

  2. 2015 Multi-University Training Contest 9 hdu 5396 Expression

    Expression Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total ...

  3. NYIST 119 士兵杀敌(三)

    士兵杀敌(三)时间限制:2000 ms | 内存限制:65535 KB难度:5 描述南将军统率着N个士兵,士兵分别编号为1~N,南将军经常爱拿某一段编号内杀敌数最高的人与杀敌数最低的人进行比较,计算出 ...

  4. 洛谷 U249 匹配

    U249 匹配 题目描述 输入整数s和两个整数集合A和B,从这A和B中各取一个数,如果它们的和等于s,称为“匹配”.编程统计匹配的总次数 输入输出格式 输入格式: 第一行为三个整数s(0<s≤1 ...

  5. 用Python实现简单的服务器

    socket接口是实际上是操作系统提供的系统调用.socket的使用并不局限于Python语言,你可以用C或者JAVA来写出同样的socket服务器,而所有语言使用socket的方式都类似(Apach ...

  6. [Performance] Optimize Paint and Composite for the website

    "Paint" is one of the most preference killer, it can easily cost more than 60fps, and once ...

  7. Gradle:Gradle入门

    一.安装Gradle  1.首先确保你安装的JDK1.5或以上版本号.  C:\Users\chengxiang.peng.QUNARSERVERS>java -version java ver ...

  8. 王立平--TF卡

    最终知道TF卡是什么了... TF卡又称microSD,是一种极细小的快闪存储器卡,由SanDisk(闪迪)公司发明创立. 这样的卡主要于手机使用.但因它拥有体积极小的长处,随着不断提升的容量. 它慢 ...

  9. js中的三种函数写法

    js中的三种函数写法 <script type="text/javascript"> //普通的声明方式 function myFun(m,n){ alert(m+n) ...

  10. 33.Qt模型与视图

    #include "mainwindow.h" #include <QApplication> #include <QAbstractItemModel> ...