自動播放
自動完成
上一個單元
Complete and Continue
[FE102] 前端必備:JavaScript
課前須知
課前須知
課程簡介
課程簡介 (1:50)
JavaScript 與瀏覽器的溝通
執行 JavaScript 的一百種方式 (4:35)
DOM 是什麼? (2:35)
如何選到想要的元素:getElement (8:26)
改變元素的 CSS (3:33)
改變元素的 Class (2:50)
改變內容:inner、outer 的 HTML 與 text (4:25)
插入與刪除元素:appendChild 與 removeChild (3:45)
JavaScript 網頁事件處理
eventListener 與 callback function (3:48)
詳細講解 callback function (2:31)
event(e) 是什麼碗糕? (6:10)
表單事件處理 onSubmit (4:10)
阻止預設行為:preventDefault (2:05)
比複雜更複雜的事件傳遞機制 (2:58)
事件傳遞機制詳解:捕獲與冒泡 (5:32)
別向上級回報:stopPropagation (4:09)
新手 100% 會搞錯的事件機制問題 (8:03)
欸等等幫我拿餐點:event delegation (6:01)
綜合示範:簡易密碼產生器 (15:37)
綜合示範:動態表單通訊錄 (7:46)
如何在瀏覽器上儲存資料?
網頁的資料都存在哪裡?為什麼換台電腦購物車就清空了? (1:07)
最古老的方式:Cookie (4:55)
最推薦的儲存方式:local storage (4:43)
一閃即逝:session storage (2:08)
中場總結
學了這些之後,可以幹嘛? (1:42)
遺漏的最後一塊拼圖:資料的交換 (0:53)
網頁與伺服器的溝通
幫你喚回記憶:API 與網頁伺服器 (2:05)
用 node.js 呼叫 API 與在網頁上呼叫的根本差異是什麼? (3:02)
傳送資料的第一種方式:表單 form (4:02)
傳送資料的第二種方式:ajax (7:54)
詳細解析 XMLHttpRequest (3:15)
Same origin policy 與跨網域問題 (4:37)
瀏覽器住海邊嗎,為什麼管這麼寬? (1:55)
你絕對用過,但絕對沒想過的第三種方式 (4:36)
單向傳送資料的延伸應用(email 與追蹤) (1:44)
綜合示範:抓取資料並顯示 (7:49)
小地方大學問:內容產生的地方在 client 還是 server (1:41)
總結
課程總結 (1:40)
Teach online with
比複雜更複雜的事件傳遞機制
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock