目录
jQuery ajax() 函数是最低级别的抽象
jQuery 支持跨域 JSONP
停止浏览器缓存 XHR 请求
首页 CMS教程 &#&按 jQuery 简化指南:探索 jQuery 和 Ajax

jQuery 简化指南:探索 jQuery 和 Ajax

Sep 02, 2023 pm 09:05 PM

jQuery 简化指南:探索 jQuery 和 Ajax

jQuery ajax() 函数是最低级别的抽象

jQuery ajax() 函数是可用于 XMLHttpRequest(又名 AJAX)的最低抽象级别。所有其他 jQuery AJAX 函数(例如 load())都利用 ajax() 函数。使用 ajax() 函数为 XMLHttpRequests 提供了最强大的功能。 jQuery 还提供了其他更高级别的抽象来执行非常特定类型的 XMLHttpRequests。这些函数本质上是 ajax() 方法的快捷方式。

这些快捷方法是:

  • 加载()
  • <code>get()
  • <code>getJSON()
  • <code>getScript()
  • <code>post()

需要注意的是,虽然快捷方式有时很好,但它们都在幕后使用 ajax() 。而且,当您需要 jQuery 在 AJAX 方面提供的所有功能和自定义功能时,您应该使用 ajax() 方法。

注意:默认情况下,ajax()load() AJAX 函数均使用 GET HTTP 协议。


jQuery 支持跨域 JSONP

带有填充的 JSON (JSONP) 是一种技术,允许 HTTP 请求(返回 JSON)的发送者为使用 JSON 对象作为函数参数进行调用的函数提供名称。该技术不使用 XHR。它使用脚本元素,因此可以将数据从任何站点拉入任何站点。目的是为了规避XMLHttpRequest的同源策略限制。

使用 <code>getJSON() jQuery 函数,当 URL 中添加 JSONP 回调函数时,您可以从另一个域加载 JSON 数据。作为示例,以下是使用 Flickr API 的 URL 请求的样子。

<span class="sgc-100">http://api.flickr.com/services/feeds/photos_public.gne?tags=resig&tagmode=all&format=json&jsoncallback</span>=?

? 值用作快捷方式,告诉 jQuery 调用作为 ? 值用作快捷方式,告诉 jQuery 调用作为 <code>getJSON() 函数的参数传递的函数。如果您不想使用此快捷方式,可以将 ? 函数的参数传递的函数。如果您不想使用此快捷方式,可以将 ? 替换为另一个函数的名称。

下面,我使用 Flickr JSONP API 拉入一个网页,其中包含带有“resig”标签的最新照片。请注意,我使用的是 ? 快捷方式,因此 jQuery 将简单地调用我提供的 ? 快捷方式,因此 jQuery 将简单地调用我提供的 <code>getJSON() 函数的回调函数。传递给回调函数的参数是请求的JSON数据。

<!DOCTYPE html>
<html lang="en">
<body>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>  (function($){      
      $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=resig&amp;tagmode=all&amp;format=json&amp;jsoncallback=?",
          // Using ? just means call the callback function provided
          function (data) { // Data is the JSON object from Flickr    
              $.each(data.items, function (i, item) { $('<img />').attr("src", item.media.m).appendTo('body'); if (i == 30) return false; });
          });
  })(jQuery); </script>
</body>
</html>
登录后复制

注意:请确保检查您所使用的服务的 API 以便正确使用回调。例如,Flickr 使用名称 jsoncallback=?,而 Yahoo!和 Digg 使用名称 callback=?


停止浏览器缓存 XHR 请求

执行 XHR 请求时,Internet Explorer 将缓存响应。如果响应包含具有较长保质期的静态内容,则缓存可能是一件好事。但是,如果请求的内容是动态的并且可能随时发生变化,您将需要确保浏览器不会缓存该请求。一种可能的解决方案是将唯一的查询字符串值附加到 URL 的末尾。这将确保浏览器对于每个请求请求唯一的 URL。

// Add unique query string at end of the URL
url: 'some?nocache='+(newDate()).getTime()
登录后复制

另一个解决方案(更多的是全局解决方案)是默认设置所有 AJAX 请求以包含我们刚才讨论的无缓存逻辑。为此,请使用 ajaxSetup 函数全局关闭缓存。

$.ajaxSetup({
            cache: false // True by default. False means caching is off.
});
登录后复制

现在,为了用单独的 XHR 请求覆盖此全局设置,您只需在使用 ajax() 函数时更改缓存选项即可。下面是使用 ajax() 函数执行 XHR 请求的代码示例,该函数将覆盖全局设置并缓存请求。

$.ajaxSetup ({   
    cache: false // True by default. False means caching is off.   
});       
jQuery.ajax({ cache: true, url: 'some', type: 'POST' } );
登录后复制

以上是jQuery 简化指南:探索 jQuery 和 Ajax的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何开始WordPress博客:初学者的分步指南 如何开始WordPress博客:初学者的分步指南 Apr 17, 2025 am 08:25 AM

博客是人们在网上表达观点、意见和见解的理想平台。许多新手渴望建立自己的网站,却因担心技术障碍或成本问题而犹豫不决。然而,随着平台不断发展以满足初学者的能力和需求,现在开始变得比以往任何时候都更容易。 本文将逐步指导您如何建立一个WordPress博客,从主题选择到使用插件提升安全性和性能,助您轻松创建自己的网站。 选择博客主题和方向 在购买域名或注册主机之前,最好先确定您计划涵盖的主题。个人网站可以围绕旅行、烹饪、产品评论、音乐或任何激发您兴趣的爱好展开。专注于您真正感兴趣的领域可以鼓励持续写作

对于初学者来说,WordPress容易吗? 对于初学者来说,WordPress容易吗? Apr 03, 2025 am 12:02 AM

WordPress对初学者来说容易上手。1.登录后台后,用户界面直观,简洁的仪表板提供所有必要功能链接。2.基本操作包括创建和编辑内容,所见即所得的编辑器简化了内容创建。3.初学者可以通过插件和主题扩展网站功能,学习曲线存在但可以通过实践掌握。

如何在父分类的存档页面上显示子分类 如何在父分类的存档页面上显示子分类 Apr 19, 2025 pm 11:54 PM

您想了解如何在父分类存档页面上显示子分类吗?在自定义分类存档页面时,您可能需要执行此操作,以使其对访问者更有用。在本文中,我们将向您展示如何在父分类存档页面上轻松显示子分类。为什么在父分类存档页面上显示子分类?通过在父分类存档页面上显示所有子分类,您可以使其不那么通用,对访问者更有用。例如,如果您运行一个关于书籍的WordPress博客,并且有一个名为“主题”的分类法,那么您可以添加“小说”、“非小说”等子分类法,以便您的读者可以

如何在 WordPress 中获取登录用户信息以获得个性化结果 如何在 WordPress 中获取登录用户信息以获得个性化结果 Apr 19, 2025 pm 11:57 PM

最近,我们向您展示了如何通过允许用户将自己喜欢的帖子保存在个性化库中来为用户创建个性化体验。您可以通过在某些地方(即欢迎屏幕)使用他们的名字,将个性化结果提升到另一个水平。幸运的是,WordPress使获取登录用户的信息变得非常容易。在本文中,我们将向您展示如何检索与当前登录用户相关的信息。我们将利用get_currentuserinfo(); 功能。这可以在主题中的任何地方使用(页眉、页脚、侧边栏、页面模板等)。为了使其工作,用户必须登录。因此我们需要使用

如何在 WordPress 中按帖子过期日期对帖子进行排序 如何在 WordPress 中按帖子过期日期对帖子进行排序 Apr 19, 2025 pm 11:48 PM

过去,我们分享过如何使用PostExpirator插件使WordPress中的帖子过期。好吧,在创建活动列表网站时,我们发现这个插件非常有用。我们可以轻松删除过期的活动列表。其次,多亏了这个插件,按帖子过期日期对帖子进行排序也非常容易。在本文中,我们将向您展示如何在WordPress中按帖子过期日期对帖子进行排序。更新了代码以反映插件中更改自定义字段名称的更改。感谢Tajim在评论中让我们知道。在我们的特定项目中,我们将事件作为自定义帖子类型。现在

wordpress文章列表怎么调 wordpress文章列表怎么调 Apr 20, 2025 am 10:48 AM

有四种方法可以调整 WordPress 文章列表:使用主题选项、使用插件(如 Post Types Order、WP Post List、Boxy Stuff)、使用代码(在 functions.php 文件中添加设置)或直接修改 WordPress 数据库。

如何在 WordPress 中显示查询数量和页面加载时间 如何在 WordPress 中显示查询数量和页面加载时间 Apr 19, 2025 pm 11:51 PM

我们的一位用户询问其他网站如何在页脚中显示查询数量和页面加载时间。您经常会在网站的页脚中看到这一点,它可能会显示类似以下内容:“1.248秒内64个查询”。在本文中,我们将向您展示如何在WordPress中显示查询数量和页面加载时间。只需将以下代码粘贴到主题文件中您喜欢的任何位置(例如footer.php)。queriesin

我可以在3天内学习WordPress吗? 我可以在3天内学习WordPress吗? Apr 09, 2025 am 12:16 AM

能在三天内学会WordPress。1.掌握基础知识,如主题、插件等。2.理解核心功能,包括安装和工作原理。3.通过示例学习基本和高级用法。4.了解调试技巧和性能优化建议。

See all articles