`

使用jQuery简化AJAX的开发

阅读更多
使用 jQuery 将使 Ajax 变得及其简单。jQuery 提供有一些函数,可以使简单的工作变得更加简单,复杂的工作变得不再复杂。
Ajax 最常见的用法就是把一块 HTML 代码加载到页面的某个区域中去。为此,只需简单地选择所需的元素,然后使用 load() 函数即可。下面是一个用于更新统计信息的示例:
$('#stats').load('stats.html');


通常,我们只需简单地把一些参数传递给服务器中的某个页面。正如您所预料的,使用 jQuery 实现这一操作非常地简单。
您可以使用 $.post() 或者 $.get(),这由所需的方法决定。如果需要的话,您还可以传递一个可选的数据对象和回调函数。
下面显示了一个发送数据和使用回调的简单示例。
$.post('save.cgi', {
    text: 'my string',
    number: 23
}, function() {
    alert('Your data has been saved.');
});


如果您确实需要编写一些复杂的 Ajax 脚本,那么需要用到 $.ajax() 函数。
您可以指定 xml、script、html 或者 json,jQuery 将自动为回调函数准备合适的结果,这样您便可以立即使用该结果。
还可以指定 beforeSend、error、success 或者 complete 回调函数,向用户提供更多有关 Ajax 体验的反馈。此外,还有一些其它的参数可供使用,您可以使用它们设置 Ajax 请求的超时,也可以设置页面 “最近一次修改” 的状态。
下面显示了一个使用一些我所提到的参数检索 XML 文档的示例。
$.ajax({
    url: 'document.xml',
    type: 'GET',
    data: {'p1':'v1', 'p2':'v2'},
    dataType: 'xml',
    timeout: 1000,
    error: function(){
        alert('Error loading XML document');
    },
    success: function(xml){
        // do something with xml
    }
});


当 success 回调函数返回 XML 文档后,您可以使用 jQuery 检索这个 XML 文档,其方式与检索 HTML 文档是一样的。
这样使得处理 XML 文档变得相当地容易,并且把内容和数据集成到了您的 Web 站点里面。
下面显示了 success 函数的一个扩展,它为 XML 中的每个 <item> 元素都添加了一个列表项到 Web 页面中。
success: function(xml){
    $(xml).find('item').each(function(){
        var item_text = $(this).text();

        $('<li></li>')
            .html(item_text)
            .appendTo('ol');
    });
}

分享到:
评论

相关推荐

    使用jQuery 简化Ajax 开发

    使用 jQuery 简化 Ajax 开发

    使用 jQuery 简化 Ajax 开发

    使用 jQuery 简化 Ajax 开发

    使用jQuery简化Ajax开发

    jQuery 是一个强大的 JavaScript 库,由 John Resig 在 2006 年创建,旨在简化 DOM 操作和 AJAX 开发。通过使用 jQuery,开发者可以更高效、简洁地编写代码,减少重复工作,提高代码可读性和可维护性。在 AJAX 开发...

    使用jQuery简化Ajax 开发.pdf

    使用jQuery简化Ajax 开发,来自ibm社区

    Ajax\使用jQuery简化Ajax+开发.zip

    Ajax\使用jQuery简化Ajax+开发.zipAjax\使用jQuery简化Ajax+开发.zipAjax\使用jQuery简化Ajax+开发.zipAjax\使用jQuery简化Ajax+开发.zipAjax\使用jQuery简化Ajax+开发.zip

    jqueryajax使用jQuery简化Ajax开发—Ajax开发入门[1]

    Jquery Jquery Jquery Jquery Jquery Jquery Jquery Jquery Jquery Jquery

    jQuery简化Ajax开发

    资源名称:jQuery简化Ajax开发内容简介:Ajax 并不是一种语言,它只是几种旧技术如 Javascript 和 XML 以及 DOM 的综合应用,全称为 Asynchronous Javascript and XML,即 异步 Javascript 和 XML...

    《使用jQuery简化Ajax+开发》&amp;&amp;《jQuery的起点教程》

    这两本书,《使用jQuery简化Ajax+开发》和《jQuery的起点教程》,是深入理解和掌握jQuery技术的重要资源。 《使用jQuery简化Ajax+开发》这本书着重于讲解如何利用jQuery优化和简化Ajax应用程序的开发。Ajax(异步...

    jquery-ajax

    使用jQuery简化Ajax开发 "Ajax"(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许页面在无需重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。"3-使用 jQuery 简化 Ajax 开发.doc...

    使用jQuery简化Ajax开发 Ajax开发入门

    这篇文章就会带领你见识一下jQuery的哲学,探讨一下他的特性以及功能,并且会做一些ajax的示例,以及如何使用plug- in(插件)来扩展jQuery。1. 什么是jQuery?jQuery是个很优秀的Javascript库,它诞生于2006年,...

    jQuery简化Ajax[定义].pdf

    **jQuery简化Ajax操作** 在传统的JavaScript中,处理Ajax请求通常涉及复杂的DOM操作和事件绑定。例如,要为页面上某个ID为`external_links`的区域内的所有链接添加点击事件,需要编写大量的循环和DOM操作(如...

    Jquery 技术详解

    使用 jQuery 简化 Ajax 开发(转载) jQuery 是什么? jQuery 由 John Resig 创建于 2006 年初,对于任何使用 JavaScript 代码的程序员来说,它是一个非常有用的 JavaScript 库。无论您是刚刚接触 JavaScript 语言...

    使用_jQuery_简化_Ajax_开发.txt

    使用_jQuery_简化_Ajax_开发.txt使用_jQuery_简化_Ajax_开发.txt使用_jQuery_简化_Ajax_开发.txt

    项目组管理系统,Java+json+jQuery+ajax

    总结起来,这个【项目组管理系统】结合了Java的稳定性和强大的功能,利用JSON进行数据交换,借助jQuery简化前端开发,并通过Ajax提供流畅的用户体验。对于想要学习Web应用开发的人来说,这是一个很好的实践案例,...

Global site tag (gtag.js) - Google Analytics