http的交互方法有四种:get、post、put(增加数据)、delete(删除数据)

put和delete实现用的是get和post
 
get方式
页面不能被修改,只是获取查询信息。但是提交的数据会通过链接暴露在外,使用get请求会被人拿到登陆的用户名和密码,url长度有限制
post方式
页面可以修改,比如回帖、评论。但是提交的数据不会暴露在外,url长度无限制,但是提交大小会有限制
默认不被缓存,不在同一个请求域下远程请求,post都会被转为get
 
推荐两篇不错的jquery教程:《jQuery的起点教程》和《使用 jQuery 简化 Ajax 开发》
dataType:string
响应的数据类型主要是mime信息,不填写的话会智能判断。一般MIME(多功能网际邮件扩充协议)被定义在Content-Type header中。
一般包括有:xml、html、script、json、jsonp、text
 
$.ajax,$.get/$.post
$.ajax:执行异步复杂的请求,如果不需要在出错时执行可以用$.get或$.post替代
jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)
jQuery.get(url,data,success(response,status,xhr),dataType)
url(必需,其他为可选):要发送的url
data:数据
success:成功时的操作
success(data, textStatus, jqXHR):(处理后的数据、请求状态字符串、jq1.4中xhr对象)
dataType:响应的数据类型

实例:
var loginFn=function(){
$.ajax({
type:'post', //String 默认为GET
timeout:'', //Number 设置超时时间(毫秒)
url:{"url"}, //String 发送请求的地址
dataType:"json", //String xml、html、script、json、jsonp、jQuery、text
data:{'ur;':url},
//或者data可以如以下写法
data:{username:$("#username").val(),content:$("#content").val()},
//GET请求中将附在URL后;对象必须为key/value形式。如果是数组,jQuery将自动为不同值对应同一名称例如:{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2
//提交前回调函数(发送请求前可以修改XMLHttpRequest对象的函数)
beforeSend:function(XMLHttpRequest){
this; //调用本次Ajax请求时传递的options参数
},
//请求成功后处理(data可能是xmlDoc、jsonObj、html、text;textStatus
(请求状态):success、error、notimodified、timeout)
success:function(data,textStatus){
this; //调用本次Ajax请求时传递的options参数//window.location.href = data.getCodeUrl;/*location.reload();*/
},
//请求失败后处理(通常情况下textStatus和errorThrown只有其中一个包含信息)
error: function (XMLHttpRequest,textStatus,errorThrown) {
this; //调用本次Ajax请求时传递的options参数
console.log("error-----------");
},
//请求完成后处理(请求成功或失败时均调用)
complete:function(XMLHttpRequest,textStatus){
this; //调用本次Ajax请求时传递的options参数
}
});
}
$("#object").on("click",loginFn);
 
接上,success扩展:
success: function(xml){
$(xml).find('item').each(function(){
var item_text = $(this).text(); $('<li></li>')
.html(item_text)
.appendTo('ol');
});
}
load:请求加载数据并返回到指定位置。一般为常用为:点击或输入文本框在指定位置加载出文本,
如果提供数据的是方法,得用post或者get才能生效
实例:
$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});
$("#result").load("ajax/test.html", function() {
alert("Load was performed.");
});
 
浏览器兼容

function() getXhr{
var xhr;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();//非ie浏览器
}else{
xhr=new ActiveXobject('Microsoft.XMLHttp');//ie浏览器
}
}

/*保证返回内容包含text/html,超文本文件
* MIME(多功能网际邮件扩充协议)
* 被定义在Content-Type header中
*常用的有:
超文本标记语言文本 .html,.html text/html 
普通文本 .txt text/plain
RTF文本 .rtf application/rtf
GIF图形 .gif image/gif
* */
  xhr.overrideMimeType('text/html'); 
 
var xhr =new XMLHttpRequest();
→类似于jq的$.ajax
xhr.open("get/post","/*/*/url",true);
→类似于jq的type,url,async
xhr.responseType="text"/"blob"/"json";
→类似于jq的dataType
xhr.send();
→类似于jq的success
 
 
推荐参考精华:AJAX(用法总结-精华版)
 

ajax常用实例代码总结新手向参考(一)的更多相关文章

  1. Ajax常用实例

    摘录自:http://www.cnblogs.com/gaopeng527/p/4459622.html 1. 级联下拉列表 例1.1 级联下拉列表. (1)编写AjaxRequest.js文件,并将 ...

  2. 后台接受ajax传递值的实例代码

    后台接受ajax传递值的实例代码: 使用ajax可以实现无刷新数据交互,下面是一段后台代码接收ajax传递值的实例代码供需要的朋友参考,希望能够带来帮助. ajax代码如下: $(function ( ...

  3. PHP常用代码大全(新手入门必备)

    PHP常用代码大全(新手入门必备),都是一些开发中常用的基础.需要的朋友可以参考下.   1.连接MYSQL数据库代码 <?php $connec=mysql_connect("loc ...

  4. SpringMVC+Ajax实现文件批量上传和下载功能实例代码

    需求: 文件批量上传,支持断点续传. 文件批量下载,支持断点续传. 使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中. 服务器不需要打包. 支持大文件断点下载.比如下 ...

  5. jquery ajax jsonp跨域调用实例代码

    今天研究了AJAX使用JSONP进行跨域调用的方法,发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下,方便需要的朋友 客户端代码 复制代码 代码如下: <%@ Page Lan ...

  6. jQuery Ajax方法调用 Asp.Net WebService、WebMethod 的详细实例代码

    将以下html存为ws.aspx <%@ Page Language="C#" AutoEventWireup="true" %> <scri ...

  7. jQuery&nbsp;Ajax&nbsp;实例&nbsp;全解析

    jQuery Ajax 实例 全解析 jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 废话少说,直接进入正题,我 ...

  8. HBase(0.96以上版本)过滤器Filter详解及实例代码

    说明: 本文参考官方Ref Guide,Developer API和众多博客,并结合实测代码编写,详细总结HBase的Filter功能,并附上每类Filter的相应代码实现. 本文尽量遵从Ref Gu ...

  9. 模拟jQuery中的ready方法及实现按需加载css,js实例代码

    这篇文章介绍了模拟jQuery中的ready方法及实现按需加载css,js实例代码,有需要的朋友可以参考一下     一.ready函数的实现经常用jQuery类库或其他类库中的ready方法,有时候 ...

随机推荐

  1. docker入门(二)容器与镜像的关系

    [编者的话]本文用图文并茂的方式介绍了容器.镜像的区别和Docker每个命令后面的技术细节,能够很好的帮助读者深入理解Docker. 这篇文章希望能够帮助读者深入理解Docker的命令,还有容器(co ...

  2. Struts2是什么?

    Struts2是什么: Struts2是整合了struts1和webwork的技术优点的使用广泛的MVC框架: Struts2的特点: 1.基于MVC框架,结构清晰,便于开发人员掌控开发流程: 2.使 ...

  3. 使用locate 的正则查询 查找所有main.c

    locate支持正则查询的功能, 只需输入locate -r 正则表达式     即可. 现在我想查找所有main.c怎么做? 打开终端,输入shell: locate -r main.c$ PS:' ...

  4. 深入理解JAVA虚拟机之JVM性能篇---垃圾回收

    一.基本垃圾回收算法 1. 判断对象是否需要回收的方法(如何判断垃圾): 1) 引用计数(Reference Counting)  对象增加一个引用,即增加一个计数,删除一个引用则减少一个计数.垃圾回 ...

  5. linux基本语法和常用运维命令

    linux上的操作一般是命令行操作,看起来很高大上,让人畏而远之. Help!Help! 忽然间闯入的linux黑黑的世界,怎么办,不要慌.赶紧敲出一个help命令,然后回车,黑色的窗口就会展示一些常 ...

  6. Spring基础篇——bean的自动化装配

    上篇博文讲Spring的IOC容器时说道,虽然容器功能强大,但容器本身只是个空壳,需要我们主动放入装配对象,并告诉它对象之间的协作关系,然后容器才能按照我们的指示发挥它的魔力,完成装配bean的使命. ...

  7. select、poll、epoll之间的区别总结[转]

      原文链接:http://www.cnblogs.com/Anker/p/3265058.html select,poll,epoll都是IO多路复用的机制.I/O多路复用就通过一种机制,可以监视多 ...

  8. BZOJ 3932: [CQOI2015]任务查询系统 [主席树]

    传送门 题意: 任务用三元组(Si,Ei,Pi)描述,(Si,Ei,Pi)表示任务从第Si秒开始,在第Ei秒后结束(第Si秒和Ei秒任务也在运行),其优先级为Pi 调度系统会经常向查询系统询问,第Xi ...

  9. .NET Core版本七牛云SDK使用

    一.问题背景 公司目前正在将一部分的业务从.NET平台准备迁移到.NET Core上去,同时也准备启用docker进行.NET Core的部署,在项目迁移过程中,不可避免的碰到有些SDK只有在.NET ...

  10. 2018/1/19 Netty学习笔记(一)

    这段时间学了好多好多东西,不过更多是细节和思想上的,比如分布式事物,二次提交,改善代码质量,还有一些看了一些源码什么的; 记录一下真正的技术学习,关于Netty的学习过程; 首先说Netty之前先说一 ...