ajax的两种使用方式
一、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的两种使用方式的更多相关文章
- Ajax的两种实现方式
//ajax的jquery实现 function aclick(){//alert("測试一");var name = $("#userName").val() ...
- Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式
//1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...
- ajax的两种应用方式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Struts2实现ajax的两种方式
基于Struts2框架下实现Ajax有两种方式,第一种是原声的方式,另外一种是struts2自带的一个插件. js部分调用方式是一样的: JS代码: function testAjax() { var ...
- Ajax中的get和post两种请求方式的异同
Ajax中我们经常用到get和post请求.那么什么时候用get请求,什么时候用post方式请求呢? 在做回答前我们首先要了解get和post的区别. 1. get是把参数数据队列加到提交表单的A ...
- Ajax的get和post两种请求方式区别
Ajax的get和post两种请求方式区别 (摘录):http://ip-10000.blog.sohu.com/114437748.html 解get和post的区别. 1. get是把参数数据队列 ...
- easyui datagride 两种查询方式
easyui datagride 两种查询方式function doReseach() { //$('#tt').datagrid('load', { // FixedCompany: $('.c_s ...
- 斑马打印机客户端GET和POST,以及后端两种打印方式。
斑马打印机客户端GET和POST,以及后端两种打印方式. 背景环境:打印机安装在客户端外网.当用户登录时,通过ajax取服务器数据,返回打印机命令,然后客户端通过JS发送给斑马打印机. 1.使用Get ...
- Web APi之认证(Authentication)两种实现方式【二】(十三)
前言 上一节我们详细讲解了认证及其基本信息,这一节我们通过两种不同方式来实现认证,并且分析如何合理的利用这两种方式,文中涉及到的基础知识,请参看上一篇文中,就不再叙述废话. 序言 对于所谓的认证说到底 ...
随机推荐
- 【ACM-ICPC 2018 沈阳赛区网络预赛 I】Lattice's basics in digital electronics
[链接] 我是链接,点我呀:) [题意] [题解] 每个单词的前缀都不同. 不能更明示了... 裸的字典树. 模拟一下.输出一下就ojbk了. [代码] #include <bits/stdc+ ...
- 获取某个参数的值 value
Window("Flight Reservation").WinEdit("Order No:").Output CheckPoint("Order ...
- nyoj 42判断欧拉路径模板题
#include<stdio.h> #include<string.h> #define N 2100 int degree[N]; int pre[N];//很长时间没写欧拉 ...
- asp.net mvc--identity知识点
asp.net identity 特性 one asp.net identity 持久化控制和易于管理 单元测试 自定义角色 基于声明的身份验证 OWIN集成 NuGet包 identity的类图 简 ...
- spring的bean注入扫瞄方法和mybatis的dao bean注入扫描方法
spring的bean注入扫面方法:@ComponentScan(basePackages = "com.pingan.property.icore.pap.*")mybatis的 ...
- CodeForces--609C --Load Balancing(水题)
Load Balancing Time Limit: 2000MS Memory Limit: 262144KB 64bit IO Format: %I64d & %I64u Subm ...
- 从git源码安装zabbix-agent
从网上随便找了几个image,都是从svn下载的代码,根本跑不了,于是自己重新做了个,从git上拿的源码,只是build出来的image有点大,有时间再优化了 Dockerfile FROM cent ...
- crawler4j多线程爬虫统计分析数据
该事例演示了如何在多线程中统计和分析数据: 首先建一个状态实体类CrawlStat: package com.demo.collectingData; /** * 爬虫状态实体类 统计爬虫信息 * @ ...
- maven、spring jdbc与mysql、mybatis
以它们之前的一个简单用例作为实例. 一个简单的能跑起来的实例.原文网址.非常好的例子. http://www.open-open.com/lib/view/open1390534380648.html ...
- QT-解除connect
前言:解除关联. 一.新建工程 二.新建部件 在ui设计界面拖入一个line edit,一个label以及两个button按钮 右键“关联”按钮转到槽,选择clicked(),添加如下代码: void ...