資訊專欄INFORMATION COLUMN
摘要：同樣將其綁定在按鈕點擊事件上查看結(jié)果為這里需要注意，如果文檔內(nèi)的格式錯誤，雖然不會報錯，但是將無法執(zhí)行回調(diào)函數(shù)。
Ajax 通俗來講即不需要刷新頁面即可從服務(wù)器或客戶端上加載數(shù)據(jù)，當(dāng)然這些數(shù)據(jù)的格式是多種多樣的。
加載 HTML我們通常使用加載 HTML 的方法來加載 HTML 片段，并插入到指定位置，假設(shè)當(dāng)前頁面為：
同目錄下的 test.html 文件內(nèi)容為：
test
我們可以使用 load 方法來加載 HTML，將其綁定到按鈕的點擊事件上：
$("button").click(function() {
$("div").load("test.html");
});
點擊按鈕后：
加載 JSONJSON 即 Javascript Object Notation，直譯過來即 Javascript 對象表示法，因此它能很方便地表示和傳輸數(shù)據(jù)，它規(guī)定鍵和值都必須包含在雙引號內(nèi)，且函數(shù)為非法 JSON 值。
{
"name": "stephenlee",
"sex": "male"
}
將上述 JSON 數(shù)據(jù)保存在 test.json 文件內(nèi)。我們可以使用 getJSON 方法加載 JSON 數(shù)據(jù)，同樣將其綁定在按鈕的點擊事件上：
$("button").click(function() {
$.getJSON("test.json");
});
由于 getJSON 方法是作為 jQuery 的全局對象而定義的，因此這里需要使用 $ 來調(diào)用該方法。這里的 $ 指的是全局 jQuery 對象，而不是 $() 所指的個別 jQuery 對象。因此我們也稱 getJSON 函數(shù)為全局函數(shù)。
但我們會發(fā)現(xiàn)上述代碼只是獲取了 JSON 數(shù)據(jù)，但看不出任何效果，這里我們可以使用 getJSON 方法的第二參數(shù)作為回調(diào)函數(shù)來測試效果：
$("button").click(function() {
$.getJSON("test.json", function(data) {
console.log(data);
$.each(data, function(index, content) {
console.log(content);
})
});
});
點擊按鈕后，我們來看下 console 內(nèi)的輸出：
這里的 each 函數(shù)的第一個參數(shù)可以接收數(shù)組或?qū)ο?，第二個參數(shù)為值回調(diào)函數(shù)，將每次循環(huán)中數(shù)組或?qū)ο蟮漠?dāng)前索引和值做為參數(shù)。
加載 JS有時候我們不希望在頁面初次加載時就加載所有的 JS 文件,而是動態(tài)地根據(jù)需求來加載，假設(shè)當(dāng)前目錄下有一個 JS 文件，內(nèi)容為一個簡單的 alert：
$(function() {
alert("test");//
})
我們可以使用全局函數(shù) getScript 來加載該文件，同樣綁定到按鈕的點擊事件上：
$("button").click(function() {
$.getScript("test.js");
});
點擊按鈕后，加載 test.js 文件，并成功觸發(fā) alert。
加載 XML對 XML 的加載操作與 JSON 類似，因為 XML 文檔的作用也是與數(shù)據(jù)存儲相關(guān)，在同目錄下創(chuàng)建 text.xml 文件，內(nèi)容為：
stephenlee male
加載 XML 文檔可以直接使用 get 方法，為什么看上去像一個默認(rèn)方法，這個可以根據(jù) AJAX 的全稱看出端倪 - Asynchronous JavaScript And XML。
同樣將其綁定在按鈕點擊事件上：
$("button").click(function() {
$.get("test.xml", function(data) {
console.log(data);
});
});
查看 console 結(jié)果為：
這里需要注意，如果 XML 文檔內(nèi)的格式錯誤，雖然不會報錯，但是將無法執(zhí)行回調(diào)函數(shù)。
參考http://book.douban.com/subject/24669823/
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/87554.html
摘要：在前一篇介紹的數(shù)據(jù)加載中的例子都是從靜態(tài)的文件中取得數(shù)據(jù)，而更大的價值在于與后端服務(wù)器進(jìn)行數(shù)據(jù)傳遞，動態(tài)地請求和發(fā)送數(shù)據(jù)。首先用方式請求數(shù)據(jù)方式點擊標(biāo)簽后，當(dāng)前頁面為數(shù)據(jù)請求成功。 在前一篇介紹 jQuery Ajax 的數(shù)據(jù)加載中的例子都是從靜態(tài)的文件中取得數(shù)據(jù)，而 Ajax 更大的價值在于與后端服務(wù)器進(jìn)行數(shù)據(jù)傳遞，動態(tài)地請求和發(fā)送數(shù)據(jù)。 請求數(shù)據(jù) 我們可以使用 GET、POST...
摘要：觀察函數(shù)和函數(shù)可以用來作為觀察函數(shù)，我們可以使用觀察函數(shù)的回調(diào)函數(shù)來做相應(yīng)的處理。當(dāng)請求開始且尚未進(jìn)行其他傳輸時，會觸發(fā)的回調(diào)函數(shù)。當(dāng)最后一次活動請求終止時，則會執(zhí)行通過注冊的回調(diào)函數(shù)。 對于 jQuery 通過 Ajax 方式傳遞數(shù)據(jù)時，我們還可以在過程中進(jìn)行一定的處理，以便達(dá)到我們的需求。 觀察函數(shù) ajaxStart 和 ajaxStop 函數(shù)可以用來作為觀察函數(shù)，我們可以使...
摘要：添加全局函數(shù)所謂全局函數(shù)就是對象的方法，例如在一篇中介紹的等方法。 當(dāng)我們希望將一些功能性代碼重復(fù)使用，可以將其打包成一個 jQuery 插件來使用。 使用 $ 別名 首先我們在編寫插件時必須保證 jQuery 庫已經(jīng)載入，但是我們不能保證 $ 一定可用，為了使用 $ 別名，我們可以利用 IIFE （Immediately Invoked Function Expression），...
摘要：在元素一篇介紹過，可以使用來使得代碼在加載完畢后自動執(zhí)行代碼，接下來具體介紹下這個機(jī)制。這樣看上去貌似沒什么問題，但是如果有兩個函數(shù)需要指定時就會遇到麻煩，因為屬性只能保存對一個函數(shù)的引用，如果我們寫成以下形式最后代碼執(zhí)行后的效果是會覆蓋。 在元素一篇介紹過，jQuery 可以使用 $(document).ready() 來使得代碼在 DOM 加載完畢后自動執(zhí)行代碼，接下來具體介紹下這...
摘要：為了更方便對元素操作，提供了完整的選擇符體系，可以分為選擇符屬性選擇符以及自定選擇符。選擇符幾乎支持到規(guī)范中的所有選擇符。介紹個比較有用的自定義選擇符選擇符。 為了更方便對 DOM 元素操作，jQuery 提供了完整的選擇符體系，可以分為 CSS 選擇符、屬性選擇符以及自定選擇符。 CSS 選擇符 jQuery 幾乎支持 CSS1 到 CSS3 規(guī)范中的所有選擇符。舉例如下： ...
閱讀 2495·2021-11-18 10:02
閱讀 2010·2021-10-13 09:40
閱讀 3053·2021-09-07 10:07
閱讀 2176·2021-09-04 16:48
閱讀 1057·2019-08-30 13:18
閱讀 2499·2019-08-29 14:03
閱讀 2982·2019-08-29 12:54
閱讀 3203·2019-08-26 11:41
