AJAX在JQ的应用.ppt

AJAX 在 Jquery 中的应用引言 AJAX 是 Asynchronous JavaScript and XML 的缩写,其核心是通过 XMLHttpRequest 对象,以一种异步的方式,向服务器发送数据请求,并通过该对象接收请求返回的数据,从而完***机交互的数据操作。引用内容? AJAX 加载异步数据? AJAX 请求服务器数据内容加载异步数据在 Jquery 中,可以通过 AJAX 函数可以以读取文件、加载静态页面的形式,以一种异步的方式,向服务器发送数据请求,获取静态的数据。加载异步数据传统 Javascript 传统 JS方法: 传统 JS通过 XMLHttpRequest 对象,将数据加载到页面中。加载异步数据传统 Javascript 传统 JS方法: 示例: ?功能描述有两个 html 页面: 和 ,前者用于加载页,在该页中,单击“加载”按钮,在不刷新该页面的前提下,将 的内容加载到 中的 div 标记中?实现代码: 示例\ 示例\ 加载异步数据 Load 方法 JQ中的 load 方法: 不同于 JS通过 XMLHttpRequest 对象, JQ中使用 load 方法加载数据。其语法格式为: load(url,[data],[callback]) 参数 url 为加载的页面地址,可选项 data 表示发送到服务器的数据,其格式为 key/value 。另一个 callback 表示加载成功后,执行的回调函数。加载异步数据 Load 方法 load 方法: 示例: ?功能描述使用 load 方法实现上例的功能?实现代码: 示例\load 加载异步数据 getJSON 方法 getJSON 方法: JSON 格式是一种轻量级的数据组织方式,其具有文件小、读取速度快的特性。 JSON 在各种语言中有非常广泛的应用, JQuery 也内置了 getJSON 方法,用于读取 JSON 文件。其语法格式为: $.getJSON(url,[data],[callback]) 加载异步数据 getJSON 方法 getJSON 方法: 示例: ?功能描述 文件保存了一些人员信息, 建立另外一个页面,单击页面中的“获取数据”按钮时, 通过 getJSON 获取 文件中数据。?实现代码: 示例\getJSON 加载异步数据