首頁 > web前端 > js教程 > jQuery ajax實作動態執行腳本的方法_jquery

jQuery ajax實作動態執行腳本的方法_jquery

WBOY
發布: 2016-05-16 16:17:59
原創
1045 人瀏覽過

本文實例講述了jQuery ajax實作動態執行腳本的方法。分享給大家供大家參考。具體分析如下:

有時候,在頁面初次載入時就取得所需的全部JavaScript也是沒有必要的。具體需要取得哪個腳本,要視使用者的操作而定。雖然可以在需要時動態地引人<script>標籤,但注人所需程式碼的更優雅的方式則是透過jQueiy直接載入.js檔案。 </script>

向頁面中註人腳本與載入HTML片段一樣簡單。但在這種情況下,需要使用全域函數 $.getScript(),這個全域函數與它的同儕函數類似,接受一個URL參數以尋找腳本文件,請參考如下程式碼:

複製程式碼 程式碼如下:
$(document).ready(function() {

$(document).ready(function() {
$('#letter-c a').click(function(event) { event.preventDefault();
$.getScript('c.js');
}); });



在前一個例子中,接下來要做的應該是處理結果數據,以便有效地利用載入的檔案。然而, 對於一個腳本檔案來說,這個過程是自動化;換句話說,腳本會自動執行。

以這種方式取得的腳本會在目前頁面的全域環境下執行。這意味著腳本有權存取在全域環境中定義的函數和變量,當然也包括jQuery本身。因而,我們可以模仿JSON的例子來準備腳本程式碼,以便在腳本執行時將HTML插人到頁面中。現在,將以下腳本程式碼儲存到c.js中: 複製程式碼
程式碼如下:

var entries = [
{
"term": "CALAMITY",
"part": "n.",
 
 
"definition": "A more than commonly plain and...
},
{
"term": "CANNIBAL",
"part": "n.",
"definition": "A gastronome of the old school who..."
},
{
"term": "CHILDHOOD",
"part": "n.",
"definition": "The period of human life intermediate..."
}
//省略的內容
];
var html ='';
$.each(entries, function() {
html = '
';
html = '

' this.term '

';
html = '
' this.part '
';
html = '
' this.definition '
';
html = '
';
});
$('#dictionary').html(html);

最後,點擊c鏈接,應該會看到我們預期的結果。

希望本文所述對大家的jQuery程式設計有所幫助。
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板