JavaScript 新手入門課程
JavaScript 網頁前端程式教學入門課程
本JavaScript課程教案及範例,經過老師10多年的調整與優化,非常適合第一次學習程式的網頁設計師,打好JavaScript入門基本功夫
實用範例超詳細的解說,一步一步帶您克服對程式的恐懼感, 帶您建立寫程式的成就感,喜歡上寫程式,讓您前端網頁設計能力大大的提昇!
JavaScript 入門課程:網頁前端程式入門課程 【一三晚班】【姜智豪老師】
- 課程教學日期:2021 年 3 月 15 日 ~ 3 月 31 日
- 課程教學日期:3/15、3/17、3/22、3/24、3/29、3/31
- 課程教學時間:星期一、三 / 晚上 7:00 ~ 10:00
JavaScript 網頁前端程式課程 - 課程資訊
- 【 新生報名特價 6800 / 舊生會員特價 6200 】限時特價:付現金再折 200 元
- 付款方式:開課當天現場繳費【 現金 / 刷卡 / 匯款 / 支票 】
- 教學時數:每堂課 3 小時 / 共 6 堂課 / 共 3 週
- 教學教材:JavaScript 教學講義 / JavaScript 範例原始檔
- 上課地點:飛肯設計學苑 - 台北教室 【教室照片】【Google地圖】
- 聯絡電話:(02) 2370-1122
- 課後服務:上完課程後,三年內可以多次免費申請重修本課程。
JavaScript 網頁前端程式課程 - 課程適合對象
- 1. 為完全沒有「程式」基礎的設計師量身打造的 入門 JavaScript 前端程式課程
- 2. 對於 JavaScript 前端互動式網頁程式有工作需求者
- 3. 網頁設計師進修前端技能
JavaScript 網頁前端程式課程 - 課程報名資格
- 1. 必須已經可以使用 CSS 語法撰寫網頁排版的人,課程推薦(「CSS div 網頁設計排版入門班」)
- 2. 完全沒有學過 JavaScript 前端程式的人也可以參加這個課程
JavaScript 網頁前端程式課程 - 課程介紹
台北 JavaScript 前端課程推薦,幫您札札實實打好程式的基礎,從網頁設計師的角度出發,本課程是 JavaScript 的入門教學課程,為網頁設計師量身打造的 JavaScript 前端課程,為完全沒有程式基礎的人量身打造的 JavaScript 網頁前端程式入門教學課程,從最基本的指令語法講起,先一步一步從最根本打好您的 JavaScript 程式基礎,再討論JavaScript 如何控制 HTML DOM 元素 ,JavaScript 與 CSS 的整合應用...讓您學會 JavaScript 觀念和使用的精髓。
本課程的教學方式是以範例式練習為導向,上課時透過實用且精緻的商業化範例實際的操作與老師超詳細圖解化一步一步講解,學會 JavaScript 各種基本指令的運用。上課所練習的範例都是目前網路上常見又實用的商業前端網頁互動效果,從入門到精通,讓您的前端網頁設計能力大大的提昇!上課範例練熟之後就可以馬上就運用到您工作的網頁之中。
JavaScript 網頁前端程式課程 - 課程大綱
老師會因應職場的需求變化,做課程內容和範例的即時調整與修改,確保本課程的實用性和即時性。
【教學主題一:JavaScript 前端入門 】
- 建立 function 函式
- var 宣告變數
- Number 變數、String 變數
- window 物件 - 彈出式視窗
- 動態控制 HTML 內容
- this 的應用
- alert() 與 console.log()
- if else 邏輯條件式
- document 物件方法
- 互動顯示隱藏網頁區塊
- 動態控制 CSS 樣式
- substring() 截取字串應用
【 教學主題二:基本資料類型 & 複雜資料類型 】
- 數字類型 Number
- 文字類型 String
- 布林變數 Boolean
- 字串的相加串接
- 陣列類型 Array
- 影像類別 Image
- 變數的作用域範圍
- 輪播式動態廣告BANNER設計
【 教學主題三:JavaScript 與 DOM 】
- DOM Tree 是什麼?
- 透過 id 來取得 HTML 元素
- textContent() 與 innerHTML() 應用
- 數學運算
- 亂數應用
- querySelector() 更好用的選取器
- 存取/修改 HTML 元素的屬性
- 互動式網頁相薄
- 如何優化 JavaScript 程式
- 亂數 Banner 效果
【教學主題四:JavaScript 與 CSS 】
- 使用 style 控制 CSS
- 控制內部樣式與外部樣式
- TAB 頁籤選單
- 存取/修改元素的 CSS 樣式
- 手風琴開合效果
- 關於 CSS 的權重
- 舊式 addClass() removeClass() 方法
- 新式 classList 方法
- add()、remove()、toggle() 整合外部 CSS
- 網頁元素的顯示/隱藏
- 下拉選單的設計
- 關於 CSS 的權重
【教學主題五:事件處理】
- 舊式 onclick,onmouseover,onmouseout... 事件
- 滑鼠事件 與 function(){}
- 關於 window 事件
- 事件偵聽 addEventListener()
- 新式click,mouseover,mouseout... 事件
- 互動式電子相簿
【教學主題六:迴圈 & 計時器】
- for 迴圈的基本結構
- for 迴圈入門技巧
- for 迴圈多物件控制
- for 迴圈程式優化
- 計時器 setTimeout(), setInterval()
- 廣告、照片自動輪播
- 無間斷圖片自動輪播
- 可暫停的計時器 - 製作廣告輪播
【教學主題七:關於 Array 陣列】
- 建立陣列的三種方法
- 陣列儲存資料的格式
- 如何取用陣列資料
- 陣列的基本使用方法
- for 迴圈與陣列的整合
- 亂數取得陣列資料
- 使用陣列製作電子相薄
- 使用陣列製作亂數廣告
【 本課程大綱是由飛肯老師編寫,版權所有侵權必究! 】