以下為本站文章分類清單

  1. AJAXspacer
  2. ASPspacer
  3. CSSspacer
  4. Javascriptspacer
  5. Windows 應用程式spacer
  6. 網頁設計
  7. 評論、短文、雜文spacer
  8. 版主spacer
  9. 最新回應spacer

以下為本頁本文內容

[準備篇]

  • [安裝IIS
  • 在Windows上安裝Apach
  • 在Windows上安裝PHP
  • 在Windows上安裝及設定mySQL
  • 前言
  • 準備
  • 如何開始
  • 光碟資料

[觀念篇]

  1. 什麼是AJAX
  2. 什麼是非同步Javascript與XML
  3. AJAX是怎麼發展出來的
  4. AJAX和傳統技術有何不同
  5. 非同步和同步的差異
  6. 非同步有什麼好處
  7. 使用AJAX有什麼好處
  8. 為什麼要使用AJAX
  9. AJAX是怎麼運作的
  10. 什麼是 XMLHttpRequest (XHR)
  11. AJAX的Hello World
  12. 第一個AJAX程式
  13. 學習AJAX要有什麼基礎
  14. 什麼是XML文件
  15. XML文件有什麼特色
  16. AJAX為什麼要用XML文件格式回傳
    可擴充性
    不同平台,同一語言
    內容和呈現方式分離
  17. 有那些現成的AJAX網站範例
    Panic Goods
    del.icio.us
    Google Suggest
    script.aculo.us
    Cojax
    Amazon A9.com
    ProtoPage
  18. 那裡有AJAX資源工具
    AJAX 拼字檢查
    Roundcube網頁郵件系統
    Google Code
    ZK
    ASP.NET AJAX
    Yahoo Developer Network
    Dojo
    Rico
  19. AJAX是不是XHR的另一種名稱
  20. 使用AJAX和使用隱藏內置框架(IFRAME)有何不同
  21. AJAX有沒有平台限制或缺點
  22. AJAX要搭配什麼伺服器端程式語言
  23. AJAX可以和ASP/ASP.NET搭配嗎?
  24. AJAX可以和PHP搭配嗎?
  25. AJAX可以和CGI搭配嗎?

[基本技術篇]

  1. XMLHttpRequest物件有那些方法及屬性
  2. XMLHttpRequest的abort()方法
  3. XMLHttpRequest的getAllResponseHeaders()方法
  4. XMLHttpRequest的getResponseHeader()方法
  5. XMLHttpRequest的open()方法
  6. XMLHttpRequest的send()方法
  7. XMLHttpRequest的setRequestHeader()方法
  8. XMLHttpRequest的onreadystatechange屬性
  9. XMLHttpRequest的readyState屬性
  10. XMLHttpRequest的responseText屬性
  11. XMLHttpRequest的responseXML屬性
  12. XMLHttpRequest的status屬性
  13. XMLHttpRequest的statusText屬性

[範例篇]

  1. Javascript範例:動態新增表格及其他網頁元件

    瀏覽器對DOM的支援,造就出更豐富變化的網頁效果,在AJAX的應用中,瀏覽器端的處理是一項重頭戲,本例介紹如何在HTML頁面中動能新增表格。
  1. Javascript範例:動態變更頁面內容

    動態變更頁面內容最重要的指令是innerHTML,原本innerHTML是IE專用的一個語法,其他瀏覽器開始支援這個語法之後,便被大量使用在HTML設計之中,本例展示如何動態變更頁面內容。
  1. Javascript範例:圖層拖、拉、放

    當AJAX開始被廣泛使用後,網頁愈來愈像是一般應用程式,想像空間愈來愈大,圖層拖拉放的應用也就愈來愈廣,本例展示如何製作可拖拉的圖層。
  1. AJAX範例:用GET方式啟動AJAX要求

    啟動AJAX呼叫的連線方法GET相當於使用字串方式傳送,本例說明如何使用GET模式及注意事項。
  1. AJAX範例:用POST方式啟動AJAX要求

    啟動AJAX呼叫的連線方法POST相當於使用封包傳送,本例說明如何使用POST模式及注意事項。
  1. AJAX範例:解決亂碼問題

    伺服器預設都是以UTF-8方式編碼,如果瀏覽器端的編碼格式非UTF-8編碼,就可能產生亂碼,本例說明如何預防及解決。
  1. AJAX範例:即時檢查帳號是否重複

    即時帳號重複的檢查,在AJAX範例中,和Hello World之於其他程式語言般,已經成為經典,這個範例相當簡單,是AJAX入門的很好範例。
  1. AJAX範例:登錄

    本例展示如何在不切換頁面的情況,達成登錄動作,並介紹如何製作取得表單欄位值的方法。
  1. AJAX範例:解析XML檔案

    AJAX中的X字樣,就是XML,本例展示如何在伺服器回傳資料格式為XML時,能夠進行解析及運用,是個相當重要的範例。
  1. AJAX範例:伺服器以XML回傳資料

    本例展示伺服器端,使用ASP或PHP回傳XML資料格式時,必需要注意的地方,是個應用很廣泛的範例。
  1. AJAX範例:XML目錄

    本例展示將目錄資料以XML文件儲存,再透過AJAX於使用者點選不同分類時,才進行載入,目錄樣式為Windows XP樣式。
  1. AJAX範例:動態顯示表格內容

    本例展示如何使用AJAX將表單送出,處理完成後,直接在本頁的顯示表格中,自動新增一列,更新為最新結果。
  1. AJAX範例:產生動態清單

    動態清單,是AJAX應用最佳範例,尤其在清單層級很多,或資料量很大的情況,本例,以雅虎台灣的拍賣網站分類清單為例,展示如何設計動態清單。
  1. AJAX範例:ToolTips-即時名詞解說

    本例展示如何自動為頁面中的所有趣連結文字,自動加上名詞解說,並使用AJAX動態擷取資料庫中的資料顯示成ToolTips。

  1. AJAX範例:動態載入面頁資料

    本例展示如何在文件載入後,才動態將內容讀出,安排到適當版面位置,這種設計,可以減少第一次載入時的負載,是應用相當多的AJAX設計。
  1. AJAX範例:分頁顯示

    對於網頁而言,如果能有分頁的設計,也代表不用一直換頁,更具體的說,只是更換局部頁面內容即可。說穿了,正式AJAX最大特色。
  1. AJAX範例:自動更新頁面

    多人系統,尤其不停有新資訊必需更新時,能自動更新是一件很重要的事,使用AJAX技巧,能在不換頁、沒有畫面遲滯的情況下完成。是AJAX廣泛應用的例子。
  1. AJAX範例:快速瀏覽

    電腦螢幕大小,似乎永遠不夠使用想把一次想看的東西全部塞進去,如果在瀏覽各式清單時,能順便查閱更多詳細資訊,尤其是能載入對應圖片時,那就很完美了。本例展示如何製作快速瀏覽。
  1. AJAX範例:自動輸入選取

    看過Google Suggest那迷人的自動輸入建議嗎?過去只能在應用程式裡才能作動的到作,現在網頁也可以,本展示如何製作自動輸入選取,是個相當複雜的範例。
  1. AJAX範例:購物車,

    當AJAX遇上購物車時,花樣就變多了,至少,不用再忍受回不到產品頁的困擾。本例展示,如何使用AJAX來設計購物車功能。
  1. AJAX範例:產品管理

    直接用圖片進行產品管理,既方便,又直觀。本例展示如何使用產品縮圖作為索引,點選縮圖後,透過AJAX取得產品資料加以編輯。
  1. AJAX範例:秀圖機

    用AJAX設計一個幻燈片吧!本例展示,只有在使用者要瀏覽的情況下,才載入縮圖,並且可以翻頁瀏覽。
  1. AJAX範例:表格欄位資料排序

    使用表格顯示記錄式的資料,因不同需求,經常有根據欄位排序的需求,本例,使用AJAX方式,將排序的工作,交給伺服器處理,瀏覽器端只負責顯示資料。

[JavaScript指令篇]

  1. Javascript運算子





    ++
    ──

    +=
    -=
    *=
    /=
    %=
    ==
    ===
    !=

    >=

    <=
    &&
    ||
    !
  2. Javascript迴路語法
    for
    while及do while
  3. Javascript條件式語法
    if及if else
    switch
    ?
  4. avascript事件控制
    onBlur
    onFocus
    onChange
    onLoad
    onClick
    onDblClick
    onMouseOver
    onMouseOut
    onKeyUp
  5. avascript陣列
    陣列的length屬性
    sort()
    join()
    toString()
    reverse()
    push()
    pop()
    concat()
    slice()
  1. 有那些有用的XML DOM物件屬性
  2. childNodes屬性
  3. firstChild屬性
  4. lastChild屬性
  5. nextSibling屬性
  6. nodeName屬性
  7. nodeType屬性
  8. nodeValue屬性
  9. parentNode屬性
  10. previousSibling屬性
  11. 有那些DOM指令可以用來動態處理頁面
  12. hasChildNodes()方法
  13. replaceChild()方法
  14. removeChild()方法
  15. appendChild()方法
  16. getElementById()方法
  17. getElementsByName()方法
  18. getElementsByTagName()方法
  19. createElement()方法
  20. createTextNode()方法
  21. getAttribute()方法
  22. setAttribute()方法
  23. removeAttribute()方法
  24. insertBefore()方法

[附錄]

附錄01-Javascript副程式一覽表
arraj.js
createTable.js
createXHR.js
getFormValue.js
getNodeContent.js
getNodeName.js
GetXmlHttpObject.js

附錄02-伺服器端程式流程
007-checkID
007-IDChecker
013-getProduct
020-checkID
020-checkIDFRAME
044-nameData
044-nameDataBIG5
045-checkID
046-login
048-responseXML
048-1
048-2
050-saveContact
051-loadMenu
052-tooltips
055-autoRefresh
055-saveInput
056-QuickBrowse
057-autoComplete
058-putInCart
058-Cart
059-getDetail
060-loadThumb

附錄03-資料庫資料表欄位規格