程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> 關於PHP編程 >> Json學習筆記,json學習

Json學習筆記,json學習

編輯:關於PHP編程

Json學習筆記,json學習


一.昨天內容回顧

  1. 創建ajax對象

a) 主流浏覽器  new  XMLHttpRequest();

b) IE浏覽器  new ActiveXObject(“Msxml2.XMLHTTP.6.0”);

  1. 常用屬性和方法

屬性:responseText/responseXML   readyState  onreadystatechange

方法:open(方式,url地址,true/false)   send()   setRequestHeader()

  1. get請求和post請求

get請求:

傳遞參數 url地址後邊請求字符串、中文/特殊符號需要編碼處理

post請求:

傳遞參數send(參數)

調用setRequestHeader()把數據組織為xml格式

中文不需要編碼,特殊符號需要編碼

同時可以傳遞get參數信息,使用$_GET接收

  1. 異步、同步請求

open(方式,url地址,[異步true]/同步false)

異步:同一時間允許執行多個進程

同步:同一時間允許執行一個進程

 

  1. 無刷新分頁效果實現

① 傳統分頁效果實現

② ajax去封裝傳統分頁

  1. xml接收和處理

ajax+javascript合作實現xml的接收和處理

ajax屬性 responseXML 接收xml信息

文檔對象 和 普通元素節點對象 都可以調用getElementByTagName()方法

  1. 緩存處理

① 給請求的地址設置隨機數

② 給動態程序頁面設置header頭,禁止浏覽器緩存

JSON

1. 什麼是json

json: javascript  object  notation(javascript對象符號)

其是我們之前學過js的“字面量對象”

其是一種數據交換格式(之前的xml也是數據交換格式)。

img 

天氣官網服務器對外提供的“門戶網站”需要供兩部分用戶訪問:普通大眾、企業網站

其中的企業網站並不會對我們天氣網站產生廣告效益,其只會白白浪費我們許多流量。

這樣我們需要做優化處理。

img

 

 

 

為了方便企業網站使用天氣信息,把天氣信息專門通過一個”接口”給提供出來,該接口的信息專門是天氣信息,數據量可以控制。

 

通過接口給企業網站提供天氣信息,需要考慮各個企業網站語言如何方便、快速地接收該接收並解析該接口信息。這樣接口信息提供出來就需要組織為特定的格式,該格式可以是xml或json。

 

 

接口專門負責提供天氣預報信息:

img 

http://php.weather.sina.com.cn/iframe/index/w_cl.php?code=js&day=0&city=&dfc=1&charset=utf-8

 

之前企業網站需要獲得天氣信息,通常會把天氣預報官網首頁的全部信息都給請求回來,但是只是在裡邊獲得很少的天氣信息,這樣做對帶寬、天氣官網的服務器、用戶等待時間的消耗比較嚴重。

這個事件做優化處理:天氣預報網站服務器把天氣信息做成一個數據接口提供出來,好處是企業網站每次請求天氣信息的帶寬變小、請求速度加快,天氣預報網站服務器的負載得到控制。

 

為了各種語言(java/php/.net/javascript)的網站用戶方便使用該數據接口,其接口的數據格式最好是大家都可以識別的,因此json/xml就被應用上了。

json的生成和處理要比xml更加方便,因此在許多領域json正逐步取代xml的使用。

2. json的使用

2.1 javascript裡邊json體現

json在javascript裡邊就是字面量對象

var obj = {名稱:值,名稱:值,名稱:function(){}}

2.2 通過php生成json信息

json_encode(數組/對象)------------>生成json信息

json_encode(關聯數組)---->json對象

json_encode(索引數組)---->js數組

json_encode(索引關聯數組)---->json對象

json_encode(對象)---->json對象

各數組/對象生成的json信息如下圖:

img 

2.**3 php處理json信息**

接收到Json信息之後,要解析信息,就要反編碼處理:

json_decode(json信息,boolean); 反編碼json信息

對json字符串信息進行反編碼,變為當前語言可以識別的信息。

json_decode(json字符串,true)--->array

json_decode(json字符串,[false])--->object

     img

 

 

純json字符串反編碼操作注意:單引號,並且要加true!

img 

 

2.4 javascript接收處理json信息

ajax獲得接口信息,javascript本身處理json信息

通過eval()把接收的json字符串變成真實的對象信息

如何把一個js的字符串變為object對象:

img 

 

 

ajax和javascript合作實現json信息接收處理:使用eval函數

 

img 

 

服務器端json接口數據:

 

img 

 

3. json改造ajax無刷新分頁

imgimgimg 

imgimg 

 

① ajax的每次請求都要從服務器獲得三部分信息,對 帶寬、服務器資源、用戶等待時間 等資源都要占據三份,我們要做優化:把不發生變化的css樣式、html標簽 放到客戶端手動生成,從而減輕服務器端的工作、減輕帶寬浪費。

② 每次回來的分頁數據是“整個一個大的部分”,數據的解析、拆分非常不靈活

 

此時服務器端數據可以通過json格式傳遞回來(之前是html標簽格式)

img 

二維數組生成json信息的效果:

img 

 

 

 

 

 

 

 

 

 

 

 

 

 

在服務器端把數據組織為json格式提供出來,在客戶端解析json並把信息組織到html標簽裡邊用於顯示:

img 

 

在設置遍歷數據庫信息的時候可以加上標簽到分頁上。Nmpk在頁面上。

二.無刷新表單信息提交

表單:登錄系統、注冊會員都有表單

傳統的form表單頁面實現submit提交的時候,浏覽器會根據form標簽的action屬性值做頁面跳轉。

頁面經常跳轉會降低用戶體驗效果

有的網站有需求:登錄或注冊表單提交的時候,實現無刷新方式信息的傳送。以便提高用戶體驗

 

傳統方式dom+ajax無刷新收集、提交form表單信息:

img 

頁面沒有刷新,就把數據提交給服務器:

img 

 

1. 收集表單信息

傳統方式收集表單信息,需要寫許多重復的代碼(document.getElementById)和拼裝長串的請求信息,非常不方便開發、維護。

那麼我們要使用新技術FormData實現數據收集。

利用新技術FormData表單數據對象,可以實現快速收集表單信息。

FormData是html5的新技術,在主流浏覽器都可以正常使用。

 

利用FormData收集數據:(evt和return false都可以阻止浏覽器表單提交動作)

img 

 

實現效果:

img 

總結:

  1. json數據交換格式

php生成/解析json:

json_encode()

json_decode(json字符串,true/[false])

JS解析json:

eval(“var 名稱=”+json字符串)  

  1. json改造ajax無刷新分頁

之前ajax分頁:服務器通過html標簽組織一個“整個的分頁”數據回來,該數據不能靈活拆分,內部還有許多固定的內容(html標簽和css樣式)

json改造:只從服務器獲得數據信息、信息是通過json對象回來的其解析和處理非常靈活。

 

  1. FormData快速收集表單信息

var fd = new FormData(form標簽的元素節點對象)

2. ajax無刷新附件上傳

dom可以獲取普通表單域信息,並可以直接提交給服務器

javascript實現附件信息抓取,之前浏覽器技術由於有安全方面的限制,也不允許通過js抓取附件信息。

FormData可以實現普通表單域 和 上傳文件域 信息的收集。

 

附件上傳相關技術點:

 

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved