jQuery Simplified Guide: Exploring jQuery and Ajax-WordPress-php.cn

Home

CMS Tutorial

WordPress

jQuery Simplified Guide: Exploring jQuery and Ajax

PHPz

Sep 02, 2023 pm 09:05 PM

jQuery 简化指南：探索 jQuery 和 Ajax

jQuery ajax() function is the lowest level of abstraction

The

jQuery ajax() function is the lowest level of abstraction available for XMLHttpRequest (aka AJAX). All other jQuery AJAX functions (such as load()) leverage the ajax() function. Using the ajax() function provides the most powerful functionality for XMLHttpRequests. jQuery also provides other higher-level abstractions to perform very specific types of XMLHttpRequests. These functions are essentially shortcuts to the ajax() method.

These shortcuts are:

load()
<code>get()
<code>getJSON()
<code>getScript()
<code>post()

It's important to note that while shortcuts are sometimes nice, they all use ajax() behind the scenes. And, when you need all the features and customizations that jQuery offers in terms of AJAX, you should use the ajax() method.

Note: By default, both the ajax() and load() AJAX functions use the GET HTTP protocol.

jQuery supports cross-domain JSONP

JSON with padding (JSONP) is a technology that allows the sender of an HTTP request (which returns JSON) to provide a name for a function that is called with a JSON object as a function argument. This technology does not use XHR. It uses script elements so data can be pulled from any site into any site. The purpose is to circumvent the same-origin policy restrictions of XMLHttpRequest.

Using the <code>getJSON() jQuery function, you can load JSON data from another domain when adding a JSONP callback function to the URL. As an example, here's what a URL request looks like using the Flickr API.

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

? value is used as a shortcut to tell jQuery to call the function passed as an argument to the <code>getJSON() function. If you don't want to use this shortcut, you can replace ? with the name of another function.

Below, I use the Flickr JSONP API to pull in a web page that contains the latest photos tagged with "resig". Note that I'm using the ? shortcut, so jQuery will simply call the callback function of the <code>getJSON() function I provided. The parameter passed to the callback function is the requested JSON data.

<!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&tagmode=all&format=json&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  / alt="jQuery Simplified Guide: Exploring jQuery and Ajax" >').attr("src", item.media.m).appendTo('body'); if (i == 30) return false; });
          });
  })(jQuery); </script>
</body>
</html>

Note: Please make sure to check the API of the service you are using to use callbacks correctly. For example, Flickr uses the name jsoncallback=?, while Yahoo! and Digg use the name callback=?.

Stop browser caching XHR requests

When performing an XHR request, Internet Explorer will cache the response. Caching can be a good thing if the response contains static content with a long shelf life. However, if the content of the request is dynamic and may change at any time, you will need to ensure that the browser does not cache the request. One possible solution is to append a unique query string value to the end of the URL. This will ensure that the browser requests a unique URL for each request.

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

Another solution (more of a global solution) is to default all AJAX requests to include the no-cache logic we just discussed. To do this, turn off caching globally using the ajaxSetup function.

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

Now, in order to override this global setting with a separate XHR request, you just need to change the cache options when using the ajax() function. Below is a code example that performs an XHR request using the ajax() function, which overrides global settings and caches the request.

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

The above is the detailed content of jQuery Simplified Guide: Exploring jQuery and Ajax. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Can I learn WordPress in 3 days?Apr 09, 2025 am 12:16 AM

Can learn WordPress within three days. 1. Master basic knowledge, such as themes, plug-ins, etc. 2. Understand the core functions, including installation and working principles. 3. Learn basic and advanced usage through examples. 4. Understand debugging techniques and performance optimization suggestions.

Is WordPress a CMS?Apr 08, 2025 am 12:02 AM

WordPress is a Content Management System (CMS). It provides content management, user management, themes and plug-in capabilities to support the creation and management of website content. Its working principle includes database management, template systems and plug-in architecture, suitable for a variety of needs from blogs to corporate websites.

What is the WordPress good for?Apr 07, 2025 am 12:06 AM

WordPressisgoodforvirtuallyanywebprojectduetoitsversatilityasaCMS.Itexcelsin:1)user-friendliness,allowingeasywebsitesetup;2)flexibilityandcustomizationwithnumerousthemesandplugins;3)SEOoptimization;and4)strongcommunitysupport,thoughusersmustmanageper

Should I use Wix or WordPress?Apr 06, 2025 am 12:11 AM

Wix is suitable for users who have no programming experience, and WordPress is suitable for users who want more control and expansion capabilities. 1) Wix provides drag-and-drop editors and rich templates, making it easy to quickly build a website. 2) As an open source CMS, WordPress has a huge community and plug-in ecosystem, supporting in-depth customization and expansion.

How much does WordPress cost?Apr 05, 2025 am 12:13 AM

WordPress itself is free, but it costs extra to use: 1. WordPress.com offers a package ranging from free to paid, with prices ranging from a few dollars per month to dozens of dollars; 2. WordPress.org requires purchasing a domain name (10-20 US dollars per year) and hosting services (5-50 US dollars per month); 3. Most plug-ins and themes are free, and the paid price ranges from tens to hundreds of dollars; by choosing the right hosting service, using plug-ins and themes reasonably, and regularly maintaining and optimizing, the cost of WordPress can be effectively controlled and optimized.

Is WordPress still free?Apr 04, 2025 am 12:06 AM

The core version of WordPress is free, but other fees may be incurred during use. 1. Domain names and hosting services require payment. 2. Advanced themes and plug-ins may be charged. 3. Professional services and advanced features may be charged.

Is WordPress easy for beginners?Apr 03, 2025 am 12:02 AM

WordPress is easy for beginners to get started. 1. After logging into the background, the user interface is intuitive and the simple dashboard provides all the necessary function links. 2. Basic operations include creating and editing content. The WYSIWYG editor simplifies content creation. 3. Beginners can expand website functions through plug-ins and themes, and the learning curve exists but can be mastered through practice.

Why would anyone use WordPress?Apr 02, 2025 pm 02:57 PM

People choose to use WordPress because of its power and flexibility. 1) WordPress is an open source CMS with strong ease of use and scalability, suitable for various website needs. 2) It has rich themes and plugins, a huge ecosystem and strong community support. 3) The working principle of WordPress is based on themes, plug-ins and core functions, and uses PHP and MySQL to process data, and supports performance optimization.

See all articles