特性與用途 不會影響到原始陣列的資料 篩選符合條件的第一筆資料,並且回傳至新的陣列 直接進入寫法及範例 範例一:找出陣列中 >= 10 的資料 con...
特性與用途 不會影響到原始陣列的資料 可以篩選符合條件的內容,並且回傳至新的陣列 直接進入寫法及範例 範例一:找出陣列中 >= 10 的資料 cons...
大家都知道Google斷線時會有小恐龍的離線遊戲,以前第一次看到的時候超驚喜!(我到現在斷線的時候還是會玩一下XD)品牌如果發揮一點創意,將品牌元素加進小遊戲裡...
原型 Prototype 與 原型鍊 Prototype Chain JavaScript 每一個物件(包含函數)都有原型這個屬性用來繼承屬性與方法。原型會去參...
陣列資料處理 - map 特性 可以將原始陣列經過處理後,重新組合回傳一個新陣列 不會影響原始陣列 範例一:將陣列內的資料做運算處理 const dataL...
Callback Function 回呼函數 A function you give to another function, to be run when...
陣列資料處理 - forEach 會將陣列中的每一個元素資料進行處理 使用範例 let dataList = [10, 20, 30, 40]; dataLis...
看這個程式碼,結果會是如何? function ArrFunction(){ var arr=[]; for(var i=0;i<3;i++){ arr...
JS 原生寫法處理 AJAX XMLHttpRequest 透過建立一個XMLHttpRequest物件,開啟一個 URL 並發送請求,此為較為傳統的方式範例如...
偶爾會看到,往下滾,球就會跟著滾動的幅度以拋物線移動。 今天就來使用SVG的Path做做看!其實是我做好的第二個版本,第一個是使用GSAP & Scro...
AJAX 是什麼? AJAX 全名是 Asynchronous JavaScript And XML,是 JavaScript 使用非同步處理的技術,可以達到無...
閉包 內部函數總是可以訪問其所在的外部函數中聲明的參數和變數,即使外部函式已經結束執行了。 看看這個例子:EX: function greet(what){...
這邊先簡單介紹前面有用到的函式陳述式和函式表達式 函式陳述式:特性是放在宣告的 function 前或後都可以執行 function numA(x) {...
甚麼是立即函數? IIFE (Immediately Invoked Function Expression)從字面上可以知道就是一個 在宣告當下就會馬上被執行...
HTML 部份元素會有預設的觸發行為,像是 的連結、表單的 submit若是需要在這些元素綁定事件,讓指定的元素可以執行指定的程式碼那就得取消 HTML 預設...
使用 addEventListener 進行事件監聽,此時 EvetnListener 會建立事件物件( Event Object)並且以參數的型式回傳 <...
Arguments 它會回傳一個類陣列包含所有你傳到函數中的參數 **類陣列(Array-like):跟Array很像,但只有陣列的length屬性和通過索...
進度條一般都是搭配文章使用,主要是告訴使用者目前閱讀到哪裡~這是我自己非常喜歡的網頁設計,讓你可以預設自己閱讀的進度,安排自己時間~(太長就快逃啊!) 看到了這...
敝人很常踩到詐騙網站,第一屏就是一個慶祝的小動畫,恭喜我中獎(好想中威力彩啊) 網頁也很常有這種獎勵使用者的小動畫,譬如說送出一個訂單、或是幫忙寫了一個評價,我...
好的Nav bar的動態可以讓網站不那麼呆板,其實實作的技術也不難,就是偵測頁面的滾動向下滑的時候再出現 今天實作兩個: 提案 Nav bar的消失 Na...
After introducing about the 2 methods for timing events in the last article, let...
進場特效也是基本再基本的網頁動態!尤其是當網頁內容塞太多時,適當地加上進場特效可以幫助使用者閱讀重點。 以前常用的套件如Scroll Magic,或計算網頁滑動...
上一篇有提到,一個瀏覽器在解析網頁時,會將 HTML 內容由上至下一行一行解析成 DOM 的節點,並且透過 DOM API 來控制節點 那麼,HTML 在寫 J...
What is timing event? "JavaScript can be executed in time-intervals. This i...
今天來介紹一下往下滑和往上滑的指引動畫和搭配Web API。現在都很流行第一屏設計做好做滿,有時候太美了會讓使用者忘記(/根本不想)往下滑, 適當地指引下滑,就...
變數與型別 變數是什麼呢? 把他想成是一個容器,容器可以存放需要的資訊,這一個資訊可以是一段文字、一個數字等。 變數的命名規則 開頭字元必須是英文大小寫字元...
To make the operators meaningful for users, let’s explain by examples if stateme...
Final Calculator Design <!DOCTYPE html> <html> <head> <tit...
Data: Number, String, Boolean Number: e.g. 7, 17 String: consist of quotation m...
What is JavaScript? HTML is like the structure/bone of our body; JavaScript is...