分析一下jquery中的ajax操作

在web前端开发中,ajax是很重要的一项技术,用原生写起来很是麻烦,需要一大堆js代码,而到了jq里就被精简了许多,一起来看看:

jquery中的ajax分为三种方式:

1.$.get(),get方式获取

例子:

$(‘.btn‘).click({
  $.get(‘1.txt‘,function(data){             //‘1.txt‘为服务器上的文档,data为获取到的数据
     alert(data);
  });
})

2.$.post(),post方式获取

例子:

$(‘.btn‘).click({
  $.post(‘1.txt‘,function(data){             //‘1.txt‘为服务器上的文档,data为获取到的数据
     alert(data);
  });
})

大家可以看出,post方式和get方式其实并没有太大区别,就是请求的方式不一样。

3.$.ajax(),综合的请求方式

在项目中其实最常用的是这种方式,例子:

$(‘.btn‘).click({
  $.ajax({
     url:‘1.php‘,
     data:‘username‘:‘lingdu‘,       //其中url为请求地址,data为发送数据,成功则执行success的函数
     success:function(data){
          alert(data);
     }
  })
})

这种方式囊括了ajax的所有操作,发送和接收数据,同时这种方式效率也最高,希望大家以后尽量使用这种方式来进行ajax操作。

时间: 2024-08-26 01:04:25

分析一下jquery中的ajax操作的相关文章

jQuery中对AJAX操作的封装函数

jQuery提供了6个简化AJAX操作的函数,每个都可以代替元素AJAX中的四步代码! (1)$('xxx').load()         jQuery对象函数 (2)$.get()                   jQuery全局函数 (3)$.post()                 jQuery全局函数 (4)$.getScript()          jQuery全局函数 (5)$.getJSON()           jQuery全局函数 (6)$.ajax()     

深入理解ajax系列第九篇——jQuery中的ajax

前面的话 jQuery提供了一些日常开发中需要的快捷操作,例如load.ajax.get和post等,使用jQuery开发ajax将变得极其简单.这样开发人员就可以将程序开发集中在业务和用户体验上,而不需要理会那么繁琐的XMLHTTPRequest对象.jQuery对ajax操作进行了封装,在jQuery中$.ajax()属性最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$.getScript()和$.getJSON()方法.下面将详细介绍jQuery中的aj

在jquery中使用AJAX

在jquery中使用封装好的AJAX会对开发效率起到极大的便利,因此掌握jquery中的一系列AJAX封装函数是做好页面数据交互的必备技能: 1.在之前,我们首先需要详细了解AJAX异步请求接受的五中响应消息,根据不同的响应类型进行不同的操作 (1)text/plain    // 明文 服务器端: header('Content-Type: text/plain'); echo 'succ'; 客户端: if(xhr.responseText==='succ'){ ... } (2)text/

从零开始学习jQuery (六) jquery中的AJAX使用

本篇文章讲解如何使用jQuery方便快捷的实现Ajax功能.统一所有开发人员使用Ajax的方式. 一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍. 本篇文章讲解如何使用jQuery方便快捷的实现Ajax功能.统一所有开发人员使用Ajax的方式. 二.前言 Ajax让用户页面丰富起来, 增强了用户体验. 使用Ajax是所有Web开发的必修课. 虽然Ajax技术并不复杂, 但是实现方式还是会因为每个

jQuery入门(4)jQuery中的Ajax应用

jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax应用 一.原始Ajax与jQuery中的Ajax 首先通过实例, 来看一下jQuery实现Ajax有多简单. 下面是一个使用原始Ajax的示例: 01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

jQuery中的Ajax几种请求方式

1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. url (String) : 请求的HTML页的URL地址. data (Map) : (可选参数) 发送至服务器的 key/value 数据. callback (Callback) : (可选参数) 请求完成时(不需要是success的)的回调函数. 这个方法默认使用 GET 方式来传递的,如果[data]参数有传递数据进去,就会自动转换为POST方式的.jQuery

$.ajax()方法详解 jquery中的ajax方法

jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持. 3.timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设置. 4.async: 要求为Boolean类型的参数,默

深入理解jQuery中的ajax

前面的话 jQuery提供了一些日常开发中需要的快捷操作,例如load.ajax.get和post等,使用jQuery开发ajax将变得极其简单.这样开发人员就可以将程序开发集中在业务和用户体验上,而不需要理会那么繁琐的XMLHTTPRequest对象.jQuery对ajax操作进行了封装,在jQuery中$.ajax()属性最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$.getScript()和$.getJSON()方法.下面将详细介绍jQuery中的aj

HTML5移动开发之路(36)——jQuery中的DOM操作

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(36)--jQuery中的DOM操作 1.查询 利用选择器查找节点 使用 html() / text() / attr() 输出节点文本和属性值. 注意:下拉列表使用 val() [html] view plain copy print? <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery