1 <！DOCTYPE HTML>
2 <HTML LANG = "EN">
3 <ヘッド>
4 <メタ文字コード= "UTF-8">
5 <タイトル> ajax_demo </タイトル>
6 <スクリプトSRC = "https：//でCDN .staticfile.org / jqueryの/ 1.10.2 / jquery.min.js ">
7 </スクリプト>
8 <スタイルタイプ="テキスト/ cssの">
9 。メイン{
10 幅：500pxなど。
11 マージン：0 自動;
12 テキスト整列：センター。
ブロック;
16 垂直整列：トップ。
17 国境崩壊：崩壊。
18 }
19 のTR TD {
20 幅：200pxの。
21 境界：1ピクセルの灰色の固体。
22 }
23 </スタイル>
24
25
26 </ HEAD>
27 <BODY>
28 <！ -前端のAjax实验- >
29 <DIV クラス = "メイン">
30 <tanle ID = "テーブル">
31 <TR >
32 <TH>
33 <TH>数量</番目>
34 </ TR>
35 </ tanle>
36 の<input type = "ボタン"値= "PRINT"のonclick = "printtable（）">
37 </ div>
38 </ BODY>
39 <スクリプト>
40 機能 printtable（）{
41
42 $。AJAX（{
43 // 获取URL
44 URL： "http://hebutgo.com:8080/maps/getMapsList"、
45 // 数据类型
46 データ型： "JSON"、
47 // 获取方式
48 タイプ：」
関数（RES）{
50 コンソール。ログ（RES）;
51 $。各（res.result、関数（指数、OBJ）{
52 $（ '＃テーブル'）。追記（ "<TR> <TD>" + OBJ [ '申请人省份'] + "</ TD>" +
53 "<TD>" + OBJ [ 'カウント'] + "</ TD> <TR>" ）
54 }）
55 }
56 }）
57 }
58 </スクリプト>
59 </ HTML>
