從html加載json文件想起

 原文來自:https://www.cnblogs.com/dibaosong/p/4572274.html#top

文中給出了data.json文件內容

還給出了html文件內容

ok.

1.新建工程jQuery

2.建立文件夾html, 將data.json和json.html放進去

3.打開html,沒問題,按鈕正常出來了,點擊沒反應

4.F12

報了兩個錯,

一個是沒引入jquery, 不識別$(function(){})

另外一個是http://127.0.0.1:8020/jQuery/html/data.json 500 (Internal Server Error)

5.引入jquery.js文件, POST請求改成GET請求

點擊正常了.

如下是代碼和工程結構

 

============================================ 最後回顧一下POST和GET區別.(源自菜鳥教程)==========================================

兩種最經常使用的 HTTP 方法是：GET 和 POST。

什麼是 HTTP？

超文本傳輸協議（HTTP）的設計目的是保證客戶機與服務器之間的通訊。

HTTP 的工做方式是客戶機與服務器之間的請求-應答協議。

web 瀏覽器多是客戶端，而計算機上的網絡應用程序也可能做爲服務器端。

舉例：客戶端（瀏覽器）向服務器提交 HTTP 請求；服務器向客戶端返回響應。響應包含關於請求的狀態信息以及可能被請求的內容。

兩種 HTTP 請求方法：GET 和 POST

在客戶機和服務器之間進行請求-響應時，兩種最常被用到的方法是：GET 和 POST。

• GET - 從指定的資源請求數據。
• POST - 向指定的資源提交要被處理的數據

GET 方法

請注意，查詢字符串（名稱/值對）是在 GET 請求的 URL 中發送的：

/test/demo_form.asp?name1=value1&name2=value2

有關 GET 請求的其餘一些註釋：

• GET 請求可被緩存
• GET 請求保留在瀏覽器歷史記錄中
• GET 請求可被收藏爲書籤
• GET 請求不該在處理敏感數據時使用
• GET 請求有長度限制
• GET 請求只應當用於取回數據

POST 方法

請注意，查詢字符串（名稱/值對）是在 POST 請求的 HTTP 消息主體中發送的：

POST /test/demo_form.asp HTTP/1.1
Host: w3schools.com
name1=value1&name2=value2

有關 POST 請求的其餘一些註釋：

• POST 請求不會被緩存
• POST 請求不會保留在瀏覽器歷史記錄中
• POST 不能被收藏爲書籤
• POST 請求對數據長度沒有要求

比較 GET 與 POST

下面的表格比較了兩種 HTTP 方法：GET 和 POST。

	GET	POST
後退按鈕/刷新	無害	數據會被從新提交（瀏覽器應該告知用戶數據會被從新提交）。
書籤	可收藏爲書籤	不可收藏爲書籤
緩存	能被緩存	不能緩存
編碼類型	application/x-www-form-urlencoded	application/x-www-form-urlencoded 或 multipart/form-data。爲二進制數據使用多重編碼。
歷史	參數保留在瀏覽器歷史中。	參數不會保存在瀏覽器歷史中。
對數據長度的限制	是的。當發送數據時，GET 方法向 URL 添加數據；URL 的長度是受限制的（URL 的最大長度是 2048 個字符）。	無限制。
對數據類型的限制	只容許 ASCII 字符。	沒有限制。也容許二進制數據。
安全性	與 POST 相比，GET 的安全性較差，由於所發送的數據是 URL 的一部分。 在發送密碼或其餘敏感信息時毫不要使用 GET ！	POST 比 GET 更安全，由於參數不會被保存在瀏覽器歷史或 web 服務器日誌中。
可見性	數據在 URL 中對全部人都是可見的。	數據不會顯示在 URL 中。

其餘 HTTP 請求方法

下面的表格列出了其餘一些 HTTP 請求方法：

方法	描述
HEAD	與 GET 相同，但只返回 HTTP 報頭，不返回文檔主體。
PUT	上傳指定的 URI 表示。
DELETE	刪除指定資源。
OPTIONS	返回服務器支持的 HTTP 方法。
CONNECT	把請求鏈接轉換到透明的 TCP/IP 通道。