• 課程時長

    7 小時 54 分

  • 課程級別

    初級

  • 授課語言

    中文

這堂課你將會學到

  • 漸進式學習，搭配大量實戰講義，讓您從 0 到得心應手
  • 讓您直接帶去面試的作品集，課堂練習就是作品集，省錢省力氣
  • 教您業界最新知識，讓您獨立做出產業常見的網站效果及應用
  • 程式排版 > 命名規則 > 清晰註解 > 邏輯明確 > 版本控制，學習coding好習慣
  • 從頭到尾瞭解一個專案的開發過程，無痛對接工作應用

章節目錄

  • 1

    第 1 章 零基礎觀念灌輸篇

    • 單元 1 - 講義跟範例下載網址

    • 單元 2 - 範例下載

    • 單元 3 - 網頁技術專有名詞介紹

    • 單元 4 - 原始碼與程式

    • 單元 5 - 程式執行與環境

    • 單元 6 - javascript、jquery傻傻分不清？

    • 單元 7 - 前端與後端

    • 單元 8 - ECMAScript
  • 2

    第 2 章 開發好用工具篇

    • 單元 1 - vscode 就是讚

    • 單元 2 - chrome 開發者工具

    • 單元 3 - LiveServer
  • 3

    第 3 章 javascript 新手須知篇

    • 單元 1 - 程式的執行順序

    • 單元 2 - 什麼是DOM與載入順序還有onload事件

    • 單元 3 - 不能不知道的console.log() - 1

    • 單元 4 - 不能不知道的console.log() - 2

    • 單元 5 - 變數與保留字 - 1

    • 單元 6 - 變數與保留字 - 2

    • 單元 7 - 變數與保留字 - 3

    • 單元 8 - 你可能沒有注意的變數型別

    • 單元 9 - 運算子（加減乘除）- 1

    • 單元 10 - 運算子（加減乘除）- 2

    • 單元 11 - 分號
  • 4

    第 4 章 邏輯判斷篇

    • 單元 1 - 判斷式 if

    • 單元 2 - 判斷式 if...else

    • 單元 3 - 判斷式 if...else - 2

    • 單元 4 - 判斷式 if ... else if

    • 單元 5 - 三種等於的差別

    • 單元 6 - switch 判斷式
  • 5

    第 5 章 DOM物件與事件篇

    • 單元 1 - 獲取DOM物件（ id ）

    • 單元 2 - 獲取DOM物件（ class ）

    • 單元 3 - 獲取DOM物件（ tag）

    • 單元 4 - 什麼是 Function? 執行一下吧！

    • 單元 5 - 常見的 onclick 事件

    • 單元 6 - 操作DOM屬性

    • 單元 7 - 操作DOM style

    • 單元 8 - 匿名函式一下

    • 單元 9 - 事件綁定的兩種寫法

    • 單元 10 - innerHTML & innerText

    • 單元 11 - 常用的window方法

    • 單元 12 - onmouseover & onmouseout 事件

    • 單元 13 - 照片牆展示切換 - 1

    • 單元 14 - 照片牆展示切換 - 2

    • 單元 15 - 照片牆展示切換 - 3

    • 單元 16 - 照片牆展示切換 - 4-1

    • 單元 17 - 照片牆展示切換 - 4-2

    • 單元 18 - 照片牆展示切換 - 4-3

    • 單元 19 - Substr補充
  • 6

    第 6 章 迴圈入門篇

    • 單元 1 - while迴圈 - 1

    • 單元 2 - while迴圈 - 2

    • 單元 3 - for迴圈 - 1

    • 單元 4 - for迴圈 - 2-1

    • 單元 5 - for迴圈 - 2-2

    • 單元 6 - 全域變數與區域變數
  • 7

    第 7 章 複雜資料陣列入門篇

    • 單元 1 - 一般資料類型 & 複雜資料類型

    • 單元 2 - 什麼是陣列?

    • 單元 3 - 什麼是陣列? - 2-1

    • 單元 4 - 什麼是陣列? - 2-2

    • 單元 5 - 什麼是陣列? - 2-3

    • 單元 6 - 陣列的基礎使用push

    • 單元 7 - 陣列的基礎使用unshift

    • 單元 8 - 陣列的基礎使用pop

    • 單元 9 - 陣列的基礎使用shift

    • 單元 10 - 清空陣列
  • 8

    第 8 章 陣列迴圈組合篇

    • 單元 1 - 陣列迴圈應用
  • 9

    第 9 章 常用狀態切換操作篇

    • 單元 1 - 增加移除 class

    • 單元 2 - 切換 class

    • 單元 3 - 檢查class

    • 單元 4 - 選取狀態切換

    • 單元 5 - 選取狀態切換更升級
  • 10

    第 10 章 時間計時篇

    • 單元 1 - 計時器 setInterval()

    • 單元 2 - 計時器 setTimeout()

    • 單元 3 - 計時器進階組合( 播放、暫停、重新 ) - 1

    • 單元 4 - 計時器進階組合( 播放、暫停、重新 ) - 2

    • 單元 5 - 計時器進階組合( 播放、暫停、重新 ) - 3

    • 單元 6 - 計時器進階組合( 播放、暫停、重新 ) - 4

    • 單元 7 - 照片牆自動撥放 - 1

    • 單元 8 - 照片牆自動撥放 - 2

    • 單元 9 - 照片牆自動撥放 - 3
  • 11

    第 11 章 JQuery 入門篇

    • 單元 1 - $(document).ready

    • 單元 2 - jquery 選取器

    • 單元 3 - jquery事件

    • 單元 4 - jquery後代選取器

    • 單元 5 - show、hide - 1

    • 單元 6 - show、hide - 2

    • 單元 7 - fadeIn fadeOut - 1

    • 單元 8 - fadeIn fadeOut - 2

    • 單元 9 - attr 屬性設置

    • 單元 10 - data attribute

    • 單元 11 - jquery-class的4種姿勢

    • 單元 12 - CSS & Style 的2種姿勢

    • 單元 13 - scrollTop

    • 單元 14 - 獲取物件的座標

    • 單元 15 - animate&stop

    • 單元 16 - 獲取物件的座標 - 2
  • 12

    第 12 章 課堂總結

    • 單元 1 - 課堂總結
  • 13

    第 13 章 課後輔導

    • 單元 1 - hoisting

    • 單元 2 - 常見的數學函式Math - 1

    • 單元 3 - 常見的數學函式Math - 2

    • 單元 4 - JavaScript小數點的陷阱