iT邦幫忙

2022 iThome 鐵人賽

0
Modern Web

30天淺嘗主流前端設計系列 第 29

DAY29 簡單介紹Ajax和JSON!!

  • 分享至 

  • xImage
  •  

DAY29 簡單介紹Ajax和JSON!!

Ajax:
Ajax是Asynchronous JavaScript And XML的縮寫,Ajax具有非同步以及使用到JavaScript和XML等技術的特性。而傳統的動態網頁與使用Ajax的動態網頁有甚麼不同呢?

傳統動態網頁在進行一小個欄位或是區塊的內容更新或是載入時,明明只載入這一小部分,但瀏覽端卻需要將整個網頁內容(包括html,css,任何沒有變動到的內容,圖片等)全部傳回伺服器,伺服器在執行完後,再將整個更新完的網頁內容傳回瀏覽器端,而需要將整個網頁畫面重新顯示,可能會導致使用者看到整個網頁畫面閃動或是停格等狀況。
而Ajax導入後的動態網頁卻不需要那麼麻煩,如果只更動到一部分的內容或是與伺服器互動一小個區塊的話,瀏覽器端只需要透過XML物件傳送非同步的http執行要求,只會將需要的部分內容資料傳至伺服器端,執行完畢後,伺服器端也只需要透過http回傳的方式將結果傳回瀏覽器端,瀏覽器收到後就只需要更動特定的欄位。這樣子會有甚麼好處呢?
1.非同步的傳送及傳回資料不用每次都將所有網頁內容傳輸,所以能夠大大的節省網路頻寬的使用。
2.只傳送及傳回部分資料,能夠大大的減少伺服器的負荷。
3.不會讓使用者看到整個網頁畫面閃動或是停格的狀況。

JSON: JSON是JavaScript Object Notation的縮寫,是一種JS程式語言的資料格式,由於瀏覽器的部分通常會有一些安全性限制使得Ajax無法進行跨網域的運作,而這時我們便能夠透過JSON技術來突破。JSON能透過物件來描述資料,物件由屬性和值所組成。

今天的課程就到這邊~~~~


上一篇
DAY28 JQuery UI 元件:Selectmenu!!
下一篇
DAY30 結賽感言!
系列文
30天淺嘗主流前端設計30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言