【jQuery中的Ajax】

1.jQuery对Ajax操作进行了封装,在jQuery中最底层的方法时 $.ajax()。第二层是 load() , $.get()  和 $.post(),第三层是 $.getScript() 和 $.getJSON()。

详情请查看jQurey的API。

【load()方法】

1.load()方法时jQuery中最简单和常用的Ajax方法,能载入远程的HTML代码并插入到DOM中,它的结构是:load(url [,data] [,callback])

2.程序员只需要使用jQurey选择器为HTML片段指定目标位置,然后将要加载的文件的url作为参数传递给load()方法即可。

3.load()方法-----细节

(1)如果只需要加载目标HTML页面内的某些元素,则可以通过load()方法的URL参数来达到目的。通过URL参数指定选择符,就可以方便的从加载过来的HTML文档中选出所需要的内容,load()方法的URL参数的语法结构为“url selector”(注意:url的选择器之间有一个空格)

(2)传递方式:load()方法的传递参数根据参数data来自动自定,如果没有参数传递,采用GET方式传递,否则采用POST方式。

(3)对于必须在加载完才能继续的操作,laod()方法提供了回调函数,该函数由三个参数:代表请求返回内容的data;代表请求状态的textStatus对象和XMLHttpoRequest对象。

【小结】

1.什么是Ajax?

不用刷新页面,但可以和服务器通信的方式。使用Ajax的主要方式是XMLHttpRequest对象。

2.使用XMLHttpRequest对象实现Ajax[了解]。

3.Ajax传输数据的3中方式:

1)XML:笨重,解析困难,但 XML 是通用的数据交换格式。

2)HTML:不需要解析可以直接放到文档中,若仅更新一部分区域,但传输的数据不是很方便,且HTML代码需要拼装完成。

3)JSON:小巧,有面向对象的特征,且有很多第三方的jar包可以把Java对象或集合转为JSON字符串。

4.使用jQuery完成Ajax操作

1)load()方法:可以用于HTML文档的元素节点,把结果直接加为对应节点的子元素,通常而言,load()方法加载完后数据是一个HTML片段。

var $obj = ...
var url = ...

var args = {key:value,...}

$obj.load(url,args);

2) $.get,$.post,$.getJSON:更加灵活,出去使用load的方法情况,大部分时候都使用这三个方法。

I。基本使用

//url:Ajax请求的目标URL

//args:传递的参数:JSON格式

//data:Ajax响应成功后的数据,可能是XML,HTML,JSON

$.get(url,args,function(data){

})

II。请求JSON数据

$.get(url,args,function(data){

},"JSON");

$.post(url,args,function(data){

},"JSON");

$.getJSON(url,args,function(data){

})

Ajax_使用 jQuery 实现Ajax的更多相关文章

  1. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  2. 【原创经验分享】JQuery(Ajax)调用WCF服务

    最近在学习这个WCF,由于刚开始学 不久,发现网上的一些WCF教程都比较简单,感觉功能跟WebService没什么特别大的区别,但是看网上的介绍,就说WCF比WebService牛逼多少多少,反正我刚 ...

  3. jQuery版AJAX简易封装

    开发过程中,AJAX的应用应该说非常频繁,当然,jQuery的AJAX函数已经非常好用,但是小编还是稍微整理下,方便不同需求下,可以简化输入参数,下面是实例代码: $(function(){ /** ...

  4. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  5. 重写jquery的ajax方法

    //首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...

  6. Jquery通过Ajax方式来提交Form表单

    今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...

  7. 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache

    虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...

  8. jquery管理ajax异步-deferred对象

    今天跟大家分享一个jquery中的对象-deferred.其实早在jquery1.5.0版本中就已经引入这个对象了.不过可能在实际开发过程中用到的并不多,所以没有太在意. 这里先不说deferred的 ...

  9. Struts2 使用jQuery实现Ajax

    在jQuery中将Ajax相关的操作进行封装,使用时只需在合适的地方调用Ajax相关的方法即可,相比而言,使用jQuery实现Ajax更加简洁,方便 1.$.Ajax()可以通过发送Http请求加载远 ...

随机推荐

  1. svchost.exe 占用内存过多

    http://www.tomshardware.com/forum/20583-63-svchost-netsvcs-speed By Lokesh Chandra: Just Go to Contr ...

  2. end()与andSelf()

    end() 回到最近的一个"破坏性"操作之前.即,将匹配的元素列表变为前一次的状态. 如 果之前没有破坏性操作,则返回一个空集.所谓的"破坏性"就是指任何改变所 ...

  3. 【React Native】React Native项目设计与知识点分享

    闲暇之余,写了一个React Native的demo,可以作为大家的入门学习参考. GitHub:https://github.com/xujianfu/ElmApp.git GitHub:https ...

  4. Android项目模块化遇到的问题

    1.问题背景 gradle 4 MacOs 10.14.3 Android Studio 3 在android模块化的时候,例如,有两个模块,一个是usercenter,另一个是common. 其中u ...

  5. Android 性能优化(22)*性能工具之「Hierarchy Viewer」 Hierarchy Viewer Walkthrough

    Hierarchy Viewer Walkthrough 1.In this document Prerequisites Setting the ANDROID_HVPROTO variable W ...

  6. Linux 介绍快速浏览

    Linux 介绍 内核 库: .so 共享对象,windows:dll 动态链接库 应用程序 Linux的基本原则:1.由目的单一的小程序组成:组合小程序完成复杂任务:2.一切皆文件:3.尽量避免捕获 ...

  7. sublime 3 最新注册码

    http://9iphp.com/web/html/sublime-text-3-license-key.html

  8. C#知识点-GDI绘图

    一.开发环境 编译器:VS2013 .Net版本:4.5 二.开发过程 1.画一条直线 private void btnDrawLine_Click(object sender, EventArgs ...

  9. 6.12---Swagger中paramType---swagger的RequestParam和ApiImpliciParam----Example中方法带有selective

    paramType:表示参数放在哪个地方    header-->请求参数的获取:@RequestHeader(代码中接收注解)    query-->请求参数的获取:@RequestPa ...

  10. linux gcc编译protocol

    gcc -c test.pb-c.c//生成test.pb-c.o文件 gcc -c udp_socket_server.c//生成udp_socket_server.o gcc -o test1 u ...