計算機基礎導讀

程式設計語言

電腦基礎

JavaScript導讀

初識JavaScript

瀏覽器執行js過程

js三部分組成

js三種書寫位置

註解

輸入輸出語句

變數導讀

什麼是變數

變數的使用

變數案例

變數案例彈出用戶名

變數語法擴展

變數的命名規範

變換2個變數的值

變數小結

資料型態導讀

資料類型簡介

數位型Number

isNaN

字串型String

彈出網頁警示框

字串長度以及拼接

字串拼接加強

顯示年齡案例

boolean以及undefined和null

typeof檢測變數資料類型

字面量

轉換為字串類型

轉換為數位型parseInt和parseFloat

轉換為數位型Number與隱式轉換

計算年齡案例

簡單加法器案例

轉換為布林型

拓展閱讀之編譯與解釋語言的區別

拓展閱讀之標識符關鍵字保留字

課後作業

運算子導讀

算術運算符

表達式和傳回值

前置遞增運算符

後置遞增運算符

遞增運算子練習

前置遞增和後置遞增小結

比較運算符

邏輯運算符

邏輯運算子練習

邏輯中斷、邏輯與

邏輯中斷、邏輯或

賦值運算符

運算符優先級

流程控制分支結構導讀

流程控制

if分支語句

進入網咖案例

ifelse雙分支語句

判斷閏年案例

if else if多分支語句

判斷成績案例

三元表達式

數位補0案例

switch語句

switch注意事項

查詢水果案例

switch和ifelseif區別

循環導讀

循環的目的

for迴圈語法結構

for迴圈執行過程

斷電調試

for迴圈重複執行相同程式碼

for迴圈重複執行不同程式碼

for迴圈重複某些操作

for迴圈案例

求學生成績案例（上）

求學生成績案例（下）

一行印五顆星星

雙重for迴圈執行過程

列印5行5列的星星

列印n行n列的星星

列印倒三角形案例

九九乘法表

for迴圈小結

while循環

while案例

do while循環

do while案例

循環小結

continue關鍵字

break關鍵字

命名規格以及語法格式

循環作業

數組導讀

什麼是數組以及創建方式

存取數組元素

遍歷數組

數組長度

計算數組的和以及平均值

求數組中的最大值

數組轉換為字串

數組新增元素

數組存放1~10個值

篩選數組方法

篩選數組方法2

刪除陣列指定元素（陣列去重）

翻轉數組

複習交換兩個變數值

冒泡排序原理

冒泡排序

函數導讀

為什麼需要函數

函數的使用

利用函數求1~100累加和

函數的參數

利用函數求任兩個數的和以及累加和

函數形參和實參匹配問題

函數的回傳值

利用函數求兩個數的最大值

利用函數求數組中的最大值

return終止函數並且只能傳回一個值

函數傳回值2個注意事項

透過榨汁機看透函數

arguments的使用

利用函數求任數的最大值

利用函數翻轉數組

函數封裝冒泡排序

利用函數判斷閏年

函數可以呼叫另外一個函數

輸出2月份天數

函數的兩種宣告方式

作用域導讀

javascript作用域

全域變數和局部變數

javascript沒有區塊級作用域

作用域鏈

作用域鏈案例

javascript預解析導讀

預解析

預解析案例

物件導讀

什麼是對像以及為什麼需要對象

利用對象字面量創建對象

變數屬性函數方法的區別

利用new Object創建對象

我們為什麼需要構造函數

建構函數建立物件（上）

建構函數建立物件（下）

建構函數和物件區別

new關鍵字執行過程

遍歷對象

小結和作業

內建物件導讀

什麼是內建對象

學會查詢MDN文檔

數學物件Math最大值方法

猜數字遊戲

Date日期物件的使用

格式化日期年月日星期

格式化日期時分秒

Date總的毫秒數（時間戳記）

倒數計時（上）

倒數計時（下）

數組創建的兩種方式

檢測是否為數組的兩種方式

新增數組元素

刪除數組元素

篩選數組

數組排序

取得數組元素索引

數組去重案例

數組轉換為字串

基本包裝類型

字串不可變

根據字元返回位置

求某個字元出現的位置以及次數

根據位置返回字符

統計出現次數最多的字元（上）

統計出現次數最多的字元（下）

拼接以及截取字串

替換字串以及轉換為數組

簡單資料型別和複雜資料型態導讀

資料類型記憶體分配

簡單資料類型傳參

複雜資料類型傳參

web apis簡介導讀

js基礎和web apis兩個階段的關聯性

api和web apis

DOM導讀

DOM簡介

getElementByid取得元素

getElementsByTagName取得某類別標籤元素

H5新增取得元素方式

取得body和html元素

事件三要素

執行事件過程

操作元素修改元素內容

innerText和innerHTML的差別

操作元素-修改元素屬性

分時問候案例

操作元素-修改表單屬性

仿京東顯示隱藏密碼明文案例（上）

仿京東顯示隱藏密碼明文案例（下）

操作元素-修改樣式屬性

仿淘寶關閉二維碼案例

循環精靈圖

顯示隱藏文字方塊內容

使用className修改樣式屬性

密碼框驗證訊息

操作元素總結以及作業

排他思想（演算法）

百度換膚效果

表格隔行變色效果

表單全選取消全選（上）

表單全選取消全選（下）

取得自訂屬性值

設定移除自訂屬性

tab欄切換佈局分析（重要）

tab欄切換製作（上）

tab欄切換製作（下）

H5自訂屬性

為什麼學習節點操作以及節點簡介

節點操作之父節點

子節點

第一個子元素和最後一個子元素

新浪下拉選單

節點操作兄弟節點

節點操作之創建與新增節點

簡單版發布留言案例

節點操作-刪除節點

刪除留言案例

節點操作-複製節點

動態生成表格-建立學生數據

動態產生表格-建立行

動態產生表格-建立儲存格

動態生成表格-單元格填充數據

動態產生表格-建立刪除儲存格

動態產生表格-新增刪除操作

document.write建立元素（了解）

innerHTML與creatElement效率對比

DOM重點核心

事件高階導讀

註冊事件兩種方式

attachEvent註冊事件

刪除事件

DOM事件流理論

DOM事件流程程式碼驗證

什麼是事件對象

e.target和this區別

阻止預設行為

阻止事件冒泡

事件委託

禁止選取文字和禁止右鍵選單

獲得滑鼠在頁面中的座標

跟隨滑鼠的天使

常用的鍵盤事件

keyCode判斷使用者按下哪個鍵

模擬京東按鍵輸入內容案例

模擬京東快遞單號查詢（上）

模擬京東快遞單號查詢（下）

BOM導讀

BOM概述

頁面載入事件

調整視窗大小事件

定時器之setTimeout

回呼函數以及5秒後自動關閉的廣告

清除定時器

定時器之setInterval

倒數計時效果

清除定時器

傳簡訊案例

this指向問題

同步和非同步

同步任務和非同步任務執行流程

js執行機制

location物件常見屬性

5秒鐘之後跳頁

取得URL參數

location常見方法

navigator對象

history對象

pc端網頁特效導讀

offserLeft和offsetTop取得元素偏移

offsetWidth和offsetHeight取得元素大小

offset與style區別

取得滑鼠在盒子內的座標

拖曳模態框（上）

拖曳模態框（中）

拖曳模態框（下）

仿京東放大鏡效果頁面結構搭建

仿京東放大鏡效果顯示隱藏擋層和大盒子

仿京東放大鏡效果遮擋層跟著滑鼠

仿京東放大鏡效果限制遮蔽層移動範圍

仿京東放大鏡效果大圖片移動

client系列

立即執行函數

淘寶flexiJS源碼分析之核心原理

淘寶flexibleJS源碼分析之pagesshow事件

scroll系列

仿淘寶固定側邊欄（上）

仿淘寶固定側邊欄（下）

三大系列總結

mouseover和mouseenter區別

動畫原理

簡單動畫函數封裝

動畫函數為不同元素記錄不同定時器

緩動動畫原理

緩動動畫基本程式碼實現

緩動動畫多個目標值之間移動

緩動動畫加入回呼函數

動畫函數的使用

網頁輪播圖結構搭建

網頁輪播圖-滑鼠經過顯示隱藏左右按鈕

網頁輪播圖-動態生成小圓圈

網頁輪播圖-小圓圈排他思想

網頁輪播圖-點擊小圓圈滾動圖片

網頁輪播圖-右側按鈕無縫滾動

網頁輪播圖-克隆第一張圖片

網頁輪播圖小圓圈跟著右側按鈕一起變化

網頁輪播圖-兩個小BUG解決方案

網頁輪播圖-左側按鈕功能製作

網頁輪播圖-自動播放功能

節流閥以及邏輯中斷應用

帶有動畫的返回頂部

筋斗雲案例

行動端網頁特效導讀

行動端touch觸摸事件

行動端TouchEvent觸摸事件對象

移動端拖曳元素

行動端輪播圖-結構搭建

行動端輪播圖-佈局分析

行動端輪播圖-滾動圖片

行動端輪播圖-無縫滾動

classList類別名稱操作

行動端輪播圖-小圓點跟隨變化

行動端輪播圖-手指拖曳輪播圖

行動端輪播圖-手指滑動播放上一張下一張圖片

行動端輪播圖-回彈效果

返回頂部模組製作

行動端click事件300ms延遲問題解決方案

faskclick插件使用

swiper外掛程式使用-引用相關文件

行動端輪播圖-依照語法規範使用

swiper插件使用-參數更改

行動端其他插件以及使用總結

視訊插件zy.media.js的使用

bootstrap輪播圖

阿里百秀輪播圖製作

本地儲存導讀

本地儲存之sessionStorage

本地存儲之localStroge

記住使用者名稱案例

jQuery入門導讀

JavaScript函式庫

jQuery概述

jQuery基本使用-入口函數

jQuery頂級對象

DOM物件和jQuery對象

DOM物件和jQuery物件相互轉換

jQuery常用API導讀

jQuery基本和層級選擇器

jQuery隱式迭代

jQuery篩選選擇器

jQuery篩選方法-選擇父子元素

新浪下拉選單

jQuery其他篩選方法

jQuery排他思想

淘寶服飾精品案例

jQuery鍊式編程

jQuery修改樣式css方法

jQuery修改樣式操作類

tab欄切換案例

jQuery類別運算和className區別

jQuery顯示與隱藏效果

jQuery滑動效果以及事件切換

jQuery停止動畫排隊

jQuery淡入淡出以及突出顯示案例

jQuery自訂動畫animate方法

王者榮耀手風琴案例佈局分析

王者榮耀手風琴案例製作

jQuery屬性運算

購物車模組-全選（上）

購物車模組-全選（下）

jQuery內容文字值

購物車模組-增減商品數量

購物車模組-修改商品小計（上）

購物車模組-修改商品小計（中）

購物車模組-修改商品小計（下）

jQuery遍歷物件each方法

jQuery遍歷數據

購物車模組-計算總計數和總額

建立、新增、刪除元素

購物車模組-清理購物車

購物車模組-選取商品新增背景顏色

jQuery尺寸方法

jQuery位置方法

jQuery被捲去頭部方法

帶有動畫的返回頂部

電梯導航案例-顯示隱藏電梯導航

電梯導航案例-點擊滾動目標位置

電梯導航案例-點選當前li添加current類

電梯導航案例-滑動頁面電梯導航自動新增current類

電梯導航案例節流閥（互斥鎖）

jQuery事件導讀

事件處理on綁定一個或多個事件

on實作事件委派和給動態元素綁定事件

微博發布案例

off解綁事件

jQuery自動觸發事件

jQuery事件對象

jQuery其他方法導讀

jQuery物件拷貝extend（可選）

jQuery多庫共存

瀑布流插件使用

圖片懶加載技術

全螢幕滾動插件使用（可選）

bootstrap元件

bootstrapJS插件

阿里百秀

totolist佈局功能需求分析

todilist核心思路以及本地儲存格式

todolist按下回車讀取本機儲存數據

todolist按下回車保存最新資料到本地存儲

todolist本地儲存資料渲染載入到頁面中

todolist點擊刪除按鈕取得目前索引號

todolist點擊刪除按鈕完成刪除動作

點選複選框修改對應資料done屬性

todolist正在進行且已經完成事項製作

todolist統計正在進行且已經完成事項個數

錄影影片作用介紹

點位區域佈局樣式

地圖區域佈局樣式

使用者區域佈局樣式

訂單區域佈局樣式

銷售區域佈局樣式

通路與季度佈局樣式

排行區域佈局樣式-參考

數據視覺化項目導讀

什麼數據視覺化

數據視覺化項目概述

ECharts簡介

ECharts基本使用

選擇不同類型圖表

ECharts專案配置（上）

ECharts-grid配置

ECharts相關配置（中）

ECharts專案配置（下）

折現圖產生以及配置項目總結

數據視覺化項目適配方案分析

數據視覺化項目適配方案

專案準備以及按照自動刷新瀏覽器插件

可視化項目-body和viewport製作

可視化項目column列容器

邊框圖片使用場景以及切割原理

邊框圖片使用語法

公共面板樣式製作（上）

公共面板樣式製作（下）

透過類別名稱呼叫字體圖標

數據視覺化專案-概覽區域模組製作

數據視覺化項目-監控區域佈局分析

資料視覺化項目-監控區域tab欄切換分析

數據視覺化項目-監控區域無縫滾動

點位分佈point模組-佈局

點位分佈point-引入圖表

ECharts餅形圖-tooltip參數意義

ECharts餅形圖-series參數意義

定位分佈模組-定製配置（上）

定位分佈模組-定製配置（下）