jQuery - AJAX 簡介
什麼是 AJAX ?
AJAX = 非同步 JavaScript 和 XML(Asynchronous JavaScript and XML)。
AJAX 是一種用於建立快速動態(tài)網(wǎng)頁的技術(shù)。
透過在後臺與伺服器進(jìn)行少量資料交換,AJAX 可以使網(wǎng)頁實(shí)現(xiàn)非同步更新。這意味著可以在不重新載入整個網(wǎng)頁的情況下,對網(wǎng)頁的某個部分進(jìn)行更新。
傳統(tǒng)的網(wǎng)頁(不使用 AJAX)如果需要更新內(nèi)容,則必須重載整個網(wǎng)站頁面。
有許多使用 AJAX 的應(yīng)用程式案例:新浪微博、Google 地圖、開心網(wǎng)等等。
關(guān)於jQuery 與AJAX
JQuery是輕量級的js函式庫,它相容於CSS3,也相容於各種瀏覽器(IE 6.0+, FF1.5+, Safari 2.0 +, Opera 9.0+)。 jQuery讓用戶能更方便地處理HTML documents、events、實(shí)現(xiàn)動畫效果,並且方便地為網(wǎng)站提供AJAX互動。
透過jQuery AJAX 方法,您能夠使用HTTP Get 和HTTP Post 從遠(yuǎn)端伺服器上請求文字、HTML、XML 或JSON - 同時您能夠?qū)⑦@些外部資料直接載入網(wǎng)頁的被選元素中。
#實(shí)例:
先展示一個前端程式碼:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ //按鈕單擊時執(zhí)行 $("#testAjax").click(function(){ //Ajax調(diào)用處理 var html = $.ajax({ type: "POST", url: "text.php", data: "name=garfield&age=18", async: false }).responseText; $("#myDiv").html('<h2>'+html+'</h2>'); }); }); </script> </head> <body> <div id="myDiv"><h2>通過 AJAX 改變文本</h2></div> <button id="testAjax" type="button">Ajax改變內(nèi)容</button> </body> </html>
在展示一段後臺php程式碼,我們給命名為text.php:
<?php $msg='Hello,'.$_POST['name'].',your age is '.$_POST['age'].'!'; echo $msg; ?>
這樣我們就完成一個JQuery 簡單的?Ajax呼叫實(shí)例。