//首先上xml檔案
<?xml version="1.0" encoding="utf-8" ?><Info> <User id="1"> <name>陶國榮</name> <sex>男</sex> <email>tao_guo_rong@163.com</email> </User></Info>
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript" src="Scripts/jquery-1.7.1.min.js"></script> <script type="text/javascript"> $(function () { $("#Button1").click(function () { $.get("UserInfor.xml", function (data) { $("#divTip").empty();//先清空標記中的內容 var strHTML = ""; $(data).find("User").each(function () { var $strUser = $(this); strHTML += "姓名:" + $strUser.find("name").text() + "<br/>"; strHTML += "性別:" + $strUser.find("sex").text() + "<br/>"; strHTML += "郵箱:" + $strUser.find("email").text() + "<br/>"; }); $("#divTip").html(strHTML); //顯示 }); }); }) </script></head><body> <input type="button" id="Button1" value="ajax非同步載入資料" /> <div id="divTip"> </div></body></html>
//效果:
說明: