jQuery:

用處：簡化JavaScript的碼字量。換言之，不會js，學jQuery==腦子有坑。

原理：它封裝JavaScript常用的功能程式碼，提供一種簡便的JavaScript設計方式。

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script>
	$(function() {
		//獲取超連結物件，併為其新增單擊事件
		$("a").click(function() {
			alert("我的第一個jQuery指令碼！");
		});
		$(".flip").click(function() {
			$(".panel").slideToggle("slow");
		});
		$("#updateContent").click(function(){
			$(".flip").html("諺語");
			$(".panel").html("<p>書山有路勤為徑</p><p>學海無涯苦作舟</p>");
		});
		
	});
</script>
 

ajax：

用處：不用重新整理頁面，完成與後臺互動。

原理：new一個XMLHttpRequest物件和後臺互動，再把結果傳給前臺。

<script type="text/javascript">
	var xmlHttp = null;
	function showHint(str) {
		if (str.length == 0) {
			document.getElementById("txtHint").innerHTML = "";
			return;
		}
		try {
			xmlHttp = new XMLHttpRequest();
		} catch (e) {
			try {
				xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e) {
				alert("Your browser does not support XMLHTTP!");
				return;
			}
		}
		xmlHttp.onreadystatechange = function() {
			if (xmlHttp.readyState == 4) {
				if (xmlHttp.status == 200) {
					s = xmlHttp.responseText;
					names = s.split(",");
					h = "";
					for (i = 0; i < names.length; i++)
						h += names[i] + "<br/>";
					document.getElementById("txtHint").innerHTML = h;
				} else {
					alert(xmlHttp.status);
				}
			}
		}
		var url = "/JavaWeb/ajax?q=" + str;
		xmlHttp.open("GET", url, false);
		xmlHttp.send(null);
	}
</script>
 

json：

一種傳輸資訊的格式，效率高。

$.ajax({			
	type:"GET",//請求型別
	url:path+"/jsp/provider.do",//請求的url
	data:{method:"pcexist",proCode:proCode.val()},//請求引數
	dataType:"json",//ajax介面（請求url）返回的資料型別
	success:function(data){//data：返回資料（json物件）
		if(data.proCode == "empty"){
			validateTip(proCode.next(),{"color":"red"},imgNo+ " 請輸入供應商編碼",false);
		}else if(data.proCode == "exist"){//賬號已存在，錯誤提示
			validateTip(proCode.next(),{"color":"red"},imgNo+ " 該供應商編碼已存在",false);
		}else{//賬號可用，正確提示
			validateTip(proCode.next(),{"color":"green"},imgYes+" 該供應商編碼可以使用",true);
		}
	},
	error:function(data){//當訪問時候，404，500 等非200的錯誤狀態碼
		validateTip(proCode.next(),{"color":"red"},imgNo+" 您訪問的頁面不存在",false);
	}
});
//客戶端到伺服器
 

resp.setContentType("application/json");
PrintWriter writer = resp.getWriter();
writer.write(JSONArray.toJSONString(map));
//伺服器到客戶端