https://jsfiddle.net/birdie2019/5sfhbq8v/15/ 作業如上,雖然完成此課作業的功能但有個問題 JS程式碼的部分,作業網址第30行和第36行部分 為什麼改成event.target就無法運作了?如圖下圖 ![](https://i.i...
在這門課程之前,你所掌握的知識大多是關於「設計出漂亮的網頁」 在這門課程中,學會了 Cookie, Local Storage, AJAX 等等現代技術 從這門課程開始,你逐漸開始具備「前端工程開發」的能力 能夠跟伺服器端溝通、能將狀態存在瀏覽器端,打造出好用、功能豐富的應用程式!...
## 課程目標 認識 AJAX 錯誤處理 ## 課程內容 在前一課,我們說過以下的話 > 有些任務現在還不會立刻執行,但我先把要執行的任務交待清楚,時間點到的時候,就執行 > 以 UI 動作來說,時間點就是 `onclick` 之時、`onchange` 之時 >...
## 課程目標 認識基本的 AJAX 原理 ## 課程內容 這一課來認識大名鼎鼎的 AJAX 觀念 AJAX 全名 Asynchronous JavaScript and XML 簡單來說,就是「非同步從主機取得資料來更新網頁內容」的技術 舊式的網頁,都是瀏覽器向...
## 課程目標 認識並且能使用 Cookie 相關功能 ## 課程內容 大名鼎鼎的 cookie,很多人在科技新聞上都聽過 某某公司利用網頁 cookie 追蹤個資、某某公司偷偷用 cookie 分享個資 這類新聞提到的 cookie,就是本課在說的 cookie ...
如果你是網頁設計師,或者開發的網站以公司介紹、形象網站為主 那麼目前為止的課程,已讓你具備相當的動態網頁開發能力 各種特效與視覺效果,你都做得出來 甚至更複雜的動態效果,直接上網找現成的套件,也都不是問題,你都能夠自行研究&導入了 不過,如果需要開發與伺服器互動的應用程式,例...
第1課 ── autosize 套件 https://jsfiddle.net/birdie2019/j69s8vdc/38/ 第2課 ── vanilla-lazyload 套件 https://jsfiddle.net/birdie2019/401xa29h/104/ 第3課 ─...
https://html5drummachine.com/virtual-drum-machine/ 看了很多前端的練習作品 老實說 真的都挺無聊的.... 對我來說這種網站才酷啊!!!!!!!!! 話是這樣說 但基本功還是要慢慢練 不過我打算做這種網站 先蒐集這...
練習1 ── alert 示警元件 https://jsfiddle.net/birdie2019/4ur1c7xf/34/ 練習2 ── toast 吐司元件 https://jsfiddle.net/birdie2019/fmc6b8ht/49/ 研究了一下setTimeout()用...
在這份教材中,實際使用了多個第三方套件,來達成功能 不斷上網找適合套件、翻文件、找範例程式碼、確認堪用,是軟體工程師的日常 到處用現成套件,其實滿好玩的,可以做到很多強大的效果,也在這個過程中,了解實務上要如何跟第三方套件互動 --- 如果你是網頁設計師,目前為止的能力,已經...
## 課程目標 認識並且能使用 jQuery 套件 ## 課程內容 這一課要教的東西比較有爭議 jQuery 是 2006 - 2015 年代,前端網頁開發的王者 當時的瀏覽器廠商眾多,網頁規格 API 支援方式不同、不完整(尤其是 IE 一堆奇怪的 API) 當...
## 課程目標 認識並且能使用 Chart.js 套件 ## 課程內容 這次的套件是 https://github.com/chartjs/Chart.js 文件與 demo 在 https://www.chartjs.org/ 這是一個畫圖表、報表的工具,而且非常漂亮...
## 課程目標 認識並且能使用 vanilla-lazyload 套件 ## 課程內容 這次的套件是 https://github.com/verlok/vanilla-lazyload 文件與 demo 在 https://www.andreaverlicchi.eu/va...
進入到 JavaScript 基礎課程的第四部份 你已經算是有了初步的前端開發與設計能力了 實務上,我們在專案中大部份的功能、元件,都會去找找看「現成的」、「開源專案」來使用 也就是如果已經有人做過了、有人分享過了,如果堪用,基本上就不會自己重做一個 因為成本差太多,什麼都自...
最後,謝謝你耐心的完成這整套課程! 進階的 RWD 技巧,以及 RWD 背後深入的 css 原理,會在別門課程提到。 但是目前所學的基本技巧,應該已經很足夠使用!
最後,謝謝你耐心的完成這整套課程!
建議您將自己完成的網站分享給您的朋友,讓大家看看您最新學會的技能! 完成這些,你就完成這次的課程目標了! 想成為網頁設計師的朋友,之後可以開始找更多資源學習CSS的進階技術。 想成為前端工程師的朋友,之後可以開始找 JavaScript 的資源學習。 想成為後端工程師的朋友,...
### 第1課 ── 基本的函數操作、onclick 事件 https://jsfiddle.net/j80d9gao/17/ --- ### 第2課 ── 基本的變數操作、從 html 取得內容 https://jsfiddle.net/09v5oadu/23/ --- ### 第...
在這份教材中,實際練習了實務上常見的 UI 元件 雖然只有少少幾個元件,但已能滿足許多網站設計需求 實務上,不會經常需要手做這些元件 通常會拿現成的 UI 套件包當作基礎,接著客製化與修改,例如最知名的 Bootstrap 套件 但是,不論是網頁設計師、前端工程師,在使用現成...
## 課程目標 認識並且能實做 modal 元件 ## 課程內容 modal 中文叫「互動視窗」元件,也有人叫「燈箱」或者「視窗」 這是幾乎所有網站都會用到的元件 台灣各大媒體網站常見的「蓋板廣告」,就算是一種「視窗」 各大社群網站,逛一逛就跳出「視窗」強迫你登入...
精選技術文章、免費程式設計資源、以及業界重要新聞!