成為前端工程師｜jQuery 入門密技，愉快打造互動式網頁不求人

開發工具簡介

QUIZ：開發工具簡介

jQuery 是什麼？

QUIZ： jQuery 是什麼？

jQuery 官網的 API 文件使用

QUIZ： jQuery 官網的 API 文件使用

手動下載安裝

QUIZ：手動下載安裝

使用 CDN 方式安裝

QUIZ：使用 CDN 方式安裝

在 CodePen 上使用 jQuery

QUIZ：在 CodePen 上使用 jQuery

取得內容、屬性

QUIZ：取得內容、屬性

更新屬性、取代內容

QUIZ：更新屬性、取代內容

移除元素、新增元素

QUIZ：移除元素、新增元素

認識 name、id、class

QUIZ：認識 name、id、class

屬性與符號的理解

QUIZ：屬性與符號的理解

其它常用語法，例： :first-child、:last-child

QUIZ：其它常用語法，例： :first-child、:last-child

.first()、.last()、.eq()

QUIZ：.first()、.last()、.eq()

.slice()、.has()

QUIZ：.slice()、.has()

.filter()、.not()

QUIZ：.filter()、.not()

.prev()、.next()

QUIZ：.prev()、.next()

.siblings()、.parent()、.parents()

QUIZ：.siblings()、.parent()、.parents()

.children()、.find()

QUIZ：.children()、.find()

DOM 介紹

QUIZ：DOM 介紹

屬性的操控

QUIZ：屬性的操控

樣式的操控

QUIZ：樣式的操控

表單相關的操控(上)

表單相關的操控(下)

QUIZ：表單相關的操控

文字的操控

QUIZ：文字的操控

HTML5 data 屬性的操控

QUIZ：HTML5 data 屬性的操控

html 標籤的操控

QUIZ：html 標籤的操控

取得元素的位置座標

QUIZ：取得元素的位置座標

複製元素

QUIZ：複製元素

事件的介紹與綁定寫法

QUIZ：事件的介紹與綁定寫法

認識 DOMContentLoaded 與 load 事件

QUIZ：認識 DOMContentLoaded 與 load 事件

認識事件物件（Event Object）

QUIZ：認識事件物件（Event Object）

事件觸發寫法及注意事項，例：事件冒泡狀況

QUIZ：事件觸發寫法及注意事項，例：事件冒泡狀況

關於動態事件的綁定

QUIZ：關於動態事件的綁定

事件的觸發與解除綁定

QUIZ：事件的觸發與解除綁定

.hide() 與 .show()

QUIZ：.hide() 與 .show()

.fadeIn()、.fadeOut()、.fadeToggle()

QUIZ：.fadeIn()、.fadeOut()、.fadeToggle()

.slideUp()、slideDown()、.slideToggle()

QUIZ：.slideUp()、slideDown()、.slideToggle()

.animate() 中的 CSS 設定與時間設定

QUIZ：.animate() 中的 CSS 設定與時間設定

.animate() 中的 Easing 與 complete 參數

QUIZ：.animate() 中的 Easing 與 complete 參數

.delay() 與 .stop() 函式

QUIZ：.delay() 與 .stop() 函式

判斷陣列：$.isArray()

QUIZ：判斷陣列：$.isArray()

判斷是否有該值：$.inArray()

QUIZ：判斷是否有該值：$.inArray()

陣列的合併：$.merge()

QUIZ：陣列的合併：$.merge()

陣列的合併與取代：$.extend()

QUIZ：陣列的合併與取代：$.extend()

執行陣列、物件迴圈：$.each()

QUIZ：執行陣列、物件迴圈：$.each()

執行陣列、物件迴圈，產生新的陣列或物件：$.map()

QUIZ：執行陣列、物件迴圈，產生新的陣列或物件：$.map()

基本套件寫法

QUIZ：基本套件寫法

寫一個文字反轉套件

QUIZ：寫一個文字反轉套件

套用別人寫好的 plugin

QUIZ：套用別人寫好的 plugin

第一步：基本介面及 text 欄位事件

QUIZ：第一步：基本介面及 text 欄位事件

第二步：新增待辦事項

QUIZ：第二步：新增待辦事項

第三步：移除與清空

QUIZ：第三步：移除與清空