姓名:葉佩昀
學號:4070C028
回首頁
互動人機介面
期末
點餐
小遊戲
第一堂
例題1-2-1: 使用 alert 警告視窗
例題1-2-2: 使用 document.write
例題1-2-3: 使用 document.write 搭配字串與數值
例題1-3-1: 透過 onclick 進行簡單互動
第二堂
例題2-2-1: 第一個互動 getElementBy ??
例題2-3-1: 使用 function 功能
例題2-4-1: 使用 .innerHTML 改變元素的內部資料
例題2-4-2: 使用 .outerHTML 改變元素的外部資料
第三堂
例題3-1-1: 數值型別的變數宣告
例題3-1-2: 進行字串的累加予刪除
例題3-1-3: 使用typeof()判斷型別
例題3-2-1: 了解變數型態別,很重要喔!大家幾乎都是字串
例題3-2-2: 變更型別 parseFloat()
例題3-3-1: 來做溫度攝氏與華氏溫度的轉換
例題3-3-2: 用是不是年輕人來顯示布林值
第四堂
例題4-2-1: 用 if 回應 BMI 的結果好不好
例題4-2-1: 用 if 回應 BMI 的結果好不好 - 多重判斷
例題4-2-3: 用 if 設計一點點 UI 計算面積
例題4-3-1: 用 switch 設計一點點 UI 計算面積
例題4-4-1: 丟骰子比大小
例題4-4-2: 丟骰子比大小 - 一點點 UI
第五堂
例題5-1-1: 自己決定骰子的數量
例題5-1-2: 使用迴圈處理骰子的亂數資料
例題5-1-3: 巢狀迴圈,用九九乘法表處理看看
例題5-1-4: 巢狀迴圈,用九九乘法表處理看看-增加框線
例題5-2-1: 計算是不是質數
例題5-3-1: 用 while 迴圈做數字三角形
例題5-3-1-1: 用 while 迴圈做數字三角形
例題5-3-2: 上台報告抽籤
第六堂
例題6-1-1: 第一個陣列資料
例題6-1-2: 用陣列設計不重複的抽籤名單
例題6-2-1: 網路匯入名單
例題6-3-1: 用陣列做複選表單
例題6-3-2: 用陣列做複選表單-全選/全部選
例題6-4-1: 製作撲克牌
例題6-4-2: 製作撲克牌-開始洗牌
例題6-4-3: 製作撲克牌-翻牌遊戲
第七堂
例題7-1-1: 取得window物件的屬性
例題7-1-2: 修改window物件的屬性
例題7-2-1: 數值物件的處理
例題7-2-2: 數值物件方法的應用
例題7-2-3: 只取我要的資料
例題7-2-4: 數學物件的常數或屬性
例題7-2-5: 可憐老師期末算成績
例題7-2-6: 計算式--錯誤克服
例題7-3-1: 了解陣列的方法
例題7-3-2: 二維陣列的應用
例題7-4-1: 用 for 迴圈列出 location 的屬性
第八堂
例題8-1-1: 取得 document 的屬性
例題8-1-2: 用 createelement 建立1000個星星
例題8-1-3: 新增刪除元件
例題8-2-1: 取得日期物件的內容方式
例題8-2-2: 顯示各地的時鐘
例題8-2-3: 計算幾天後的日期
例題8-2-4: 算倒數時間
例題8-3-1: 碼表設計
例題8-3-2: 自動算倒數時間
例題8-3-3: 自動抽換圖片
例題8-3-4: 自動抽換圖片+淡出淡入(setTimeout)
例題8-3-5: 方塊沿線跑
第九堂
例題9-1-1: 暫停淡出淡入的照片抽換
例題9-1-2: 承上,練習 addEventListener
例題9-1-3: 承上,最多讓你停3次
例題9-2-1: 開新視窗,占用螢幕 1/4 大
例題9-2-2: 我要滑鼠座標
例題9-2-3: 滑鼠拖曳事件
例題9-3-1: HTML5 drag and drop 單一拖曳事件
例題9-3-2: HTML5 drag and drop 多重拖曳事件
例題9-3-3: HTML5 drag and drop 一個蘿蔔一個坑
例題9-4-1: 打 UFO 砲台製作-左右移動
例題9-4-2: 打 UFO 砲台製作-射飛彈
例題9-4-3: 打 UFO 砲台製作-連續移動與射擊
例題9-4-4: 完成打 UFO 的小遊戲
第十堂
例題10-2-1: 建立固定風格樣式
例題10-2-3: 第一個 Ajax 資料處理
例題10-3-1: 使用 responseXML
例題10-3-2: 左側資料填入右側方塊
例題10-4-1: 設計天氣小方塊
例題10-4-2: CORS 跨站 ajax 的問題
例題10-4-3: 中繼程式 API - CWB
例題10-4-4: 採用自己的網站 API 的方式處理
第十一堂
例題11-1-1: 第一個 JSON: 用 AQI 做解釋
例題11-1-2: 設計一個自我介紹的 JSON 格式資料
例題11-1-3: JSON 的陣列格式
例題11-1-4: Ajax 回傳與 JSON.parse 功能
例題11-2-1: 第一個畫方塊的 Canvas 畫布
例題11-2-2: 不同路徑繪製
例題11-2-3: 星星滿天
例題11-2-4: 畫個飛碟
例題11-2-5: 打飛碟
例題11-3-1: 地圖縮放
例題11-3-2: 資傳系平面圖
例題11-3-4: 變形企鵝
第十二堂
例題12-1-1: 星星會跑的背景圖
例題12-1-2: 星星會跑的射擊遊戲
例題12-1-3: 鐘錶的動畫
例題12-2-1: 鐘錶的動畫有音效
例題12-2-2: UFO 蹦蹦蹦
例題12-3-1: 太陽-地球-月亮 轉轉轉
例題12-3-2: 圓餅圖設計
作業
作業1-4-1: 地球
作業2-5-1: 剪刀石頭布
作業3-4-1: 判斷你的身高體重指數是否正常
作業4-5-1: 表單填寫
作業5-4-1: 網頁安全色的展示
作業5-4-2: 找最近的質數
作業6-5-1: 製作真實名單抽籤行為
作業6-5-2: 結合複選表單的功能,繼續來抽籤
作業7-5-1: 自動推算出假設的成績
作業7-5-2: 評分表
作業7-5-3: 檢查學號
作業7-5-4: 小算盤
作業8-4-1: 搭配萬聖節,製作出滿街的giwawa圖片
作業8-4-2: 搭配畫面美化,建立倒數 1 小時 2 分的畫面
作業8-4-3: 車車亂跑
作業9-5-1: 敲擊怪物的小遊戲
作業9-5-2: 會下降的飛碟
作業9-5-3: 配對遊戲
作業10-5-1: 實做一個站外的 API 應用
作業10-5-2: 將資料整合到網頁中
作業11-4-1: 自訂 JSON 物件與列表
作業11-4-2: 處理 JSON 格式以及 Ajax 回傳的訊息處理
作業11-4-3: 描繪飛機或戰鬥機圖示