jQuery 簡化指南：探索 jQuery 和 Ajax-＆＃＆按-PHP中文網

首頁

CMS教程

＆＃＆按

jQuery 簡化指南：探索 jQuery 和 Ajax

PHPz

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 呼叫作為 <code>getJSON() 函數的參數傳遞的函數。如果您不想使用此快捷方式，可以將 ? 替換為另一個函數的名稱。

下面，我使用 Flickr JSONP API 拉入一個網頁，其中包含帶有「resig」標籤的最新照片。請注意，我使用的是 ? 快捷方式，因此 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&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 簡化指南：探索 jQuery 和 Ajax" >').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

WordPress作為大型網站的CMS有多可擴展？May 12, 2025 am 12:08 AM

WordPressCanHandLeLArgeWebsiteswithCareFulplanningAndOptimization.1）USECACHINGTOREDUCESERVERVERLOAD.2）優化YourDataBaseRegularly.3）actimentAcdNtododistibuteContent.4））

WordPress的定製程度如何？May 11, 2025 am 12:11 AM

WordPress的定制化程度非常高，提供了廣泛的靈活性和可定制性。 1）通過主題和插件生態系統，2）利用RESTAPI進行前端開發，3）深入代碼層面進行修改，用戶可以實現高度個性化的體驗。然而，定制化需要掌握PHP、JavaScript、CSS等技術，且需注意性能優化和插件選擇，以避免潛在的問題。

WordPress作為CMS的核心功能是什麼？May 10, 2025 am 12:15 AM

WordPressisanexcellentchoiceforaCMSduetoitsuser-friendlyinterface,extensiveecosystem,SEOcapabilities,scalability,andsupportivecommunity.1)Itsintuitivedashboardmakescontentmanagementeasyforallusers.2)Thevastarrayofthemesandpluginsallowsforextensivecus

使用WordPress管理內容有多容易？May 09, 2025 am 12:11 AM

WordPressiser-FrightlyDuetLoitsIntuitiveInterfaceAndcms，whosparateContentFromDesign.itoffersArichTextedextEditorforeasyContentCreationAndialibraryFororRaryFororRory.itsflexeNhangedBancedBynhangedBynHangedBynumereNumerSandeMesandPlugins，elloverSandplugins，elloverOverUseCanimpActpercrance

WordPress如何在業務環境中使用？May 08, 2025 am 12:04 AM

1）ITSUPPORTSE-CommerceWithPluginSlikeWooCommerce，允許ProductManagementAndAndPaymentProcessing.2）ITSERVESASASASACMSACMSACMSMSACMSMSACMSMASTRATATEBLOGS，增強SeoAndEngagement.3）

哪些類型的網站不適合WordPress？May 07, 2025 am 12:10 AM

WordPressIsnotIdeAlforHigh-TrafficWebsites，customAndCompleXapplications，安全性 - 敏感性plicestions，Real-Timedataprocessing，AndhighlyCustomizeduserInterfaces.forhigh-Trafficsites，USENEENEXT.JSORXOLX.JSORCOSTOMSOLTICTS; forCompleXapplications; forcomplexapplications; forcomplexapplications，optfordjangoorrub

您可以使用WordPress構建博客嗎？May 06, 2025 am 12:03 AM

Yes,youcanbuildablogwithWordPress.1)ChoosebetweenWordPress.comforbeginnersorWordPress.orgformorecontrol.2)Selectathemetopersonalizeyourblog'slook.3)Usepluginstoenhancefunctionality,likeSEOandsocialmediaintegration.4)Customizeyourthemewithsimplecodetw

WordPress作為CMS平台的安全程度如何？May 05, 2025 am 12:01 AM

WordPressCanbeseCureifManagedProperly.1）keepthewordPressCoreUpdatedTopatchVulnerabilities.2）vetandupdatepluginsandthemesfromreputables.3）EnforcestrongpasseTSandusetWordssandusetWordwordwo-factorauthenticaliation.4）

See all articles