iT邦幫忙

javascript相關文章
共有 5672 則文章
鐵人賽 Modern Web DAY 13

技術 【Day13】數據展示元件 - Accordion/Collapse 摺疊面板

元件介紹 Accordion 是一個可折疊/展開內容區域的元件。主要是針對顯示內容複雜或很多的頁面進行分區塊的顯示及隱藏。 參考設計 & 屬性分析 元件...

鐵人賽 自我挑戰組 DAY 26

技術 e是咱ㄟ寶貝

前面提到那個e,蘊含著我們與網頁互動豐富的資訊。 例如: type:代表事件的類別。 target:為觸發事件的元素。 screenX / screenY:代...

鐵人賽 Modern Web DAY 11

達標好文 技術 第11車廂-table界的神器!DataTables介紹篇(1)

延續上篇的table介紹,原本功能都要自己寫,那有沒有工具可以直接套用呢?有的!那就是神器DataTables拉! 簡介 DataTables 是 jQue...

鐵人賽 Modern Web DAY 11

技術 Day 11 - 物品借用紀錄系統 (3) 發送到期與逾期通知

我們昨天順利把借物歸還事件可以自動化上傳到 Google Calendar 上,但是如果借閱人不看 Google Calendar 怎麼辦? 沒關係,我們就自動...

鐵人賽 Modern Web DAY 12

技術 入門魔法 - 常用陣列方法(一) forEach、filter、 map

前情提要 艾草:「你過來幫我擺一下魔法陣!」 「哇喔,看起來好厲害唷!這裡有三個空位是要擺什麼嗎?」 艾草:「對唷!魔法陣列內都能擺入三個參數,來這個你接著!擺...

鐵人賽 Modern Web DAY 11
Vue.js 進階心法 系列 第 11

技術 存放資料的 state、module

在 JavaScript 中,儲存資料的方式,長這樣。 { name: 'Chris', age: 18 } 抽象資料型別 ADT 強型別語言的話,要...

鐵人賽 Software Development DAY 26

技術 從 JavaScript 角度學 Python(26) - 指定直譯器

前言 這一章節開始讓自己腦袋輕鬆一點好了,畢竟前面也學了不少的東西,所以這邊就聊點簡單的好了。 指定直譯器 你有注意到許多 Python 的程式碼前面都會有一行...

鐵人賽 自我挑戰組 DAY 11

技術 [ Day 11 ] - DOM

DOM DOM 是什麼呢? DOM(Document Object Model)當瀏覽器進入網頁時,將 HTML 文件會以樹狀結構的解析,此稱為 DOM Tre...

鐵人賽 Modern Web DAY 11
JavaScript Easy Go! 系列 第 11

技術 #11 Web Crawler 4

今天,來優化爬蟲的速度。 調查問題成因 回顧一下,我們的程式執行了以下步驟: 下載網頁 解析網頁 合併數據 儲存數據 我們先來記錄一下各步驟執行的時間。 /...

鐵人賽 自我挑戰組 DAY 26
JS30 學習日記 系列 第 26

技術 Day 26 - Stripe Follow Along Dropdown Navigation [更新]

前言 JS 30 是由加拿大的全端工程師 Wes Bos 免費提供的 JavaScript 簡單應用課程,課程主打 No Frameworks、No Compi...

鐵人賽 Modern Web DAY 10

技術 Day09:Emit Direct Message I(發送個人訊息到 server 端)

全文同步於個人 Docusaurus Blog 當建立私人頻道後,下一步,便是將私人頻道的訊息發往 server-side,透過 server 轉給指定的使...

鐵人賽 Modern Web DAY 18

技術 Chpater3 今天來學習畫一棵樹(IV)淺談效能和演算法,以迭代取代遞迴吧!

昨天發完文後,覺得對於演算法還是心有不甘,便上網搜尋了一下,雖然沒直接給到答案,間接的給了我一些大膽的想法。 具體參考的是這篇:https://ithelp.i...

鐵人賽 Modern Web DAY 10

技術 #10 實作篇 — 使用 SWR 抓取和 Cache 資料

嗨大家!昨天跟大家分享一個 library 叫做 SWR,文章在這裡~ 今天用 SWR 新增了小功能,使用者可以輸入 Github username 然後列出該...

鐵人賽 Modern Web DAY 10
JavaScript 筆記 2 版 系列 第 10

技術 JavaScript Day10 - 函式

函式(function) 可參考:Day08 - 函數(01) 重複的內容會以函式來定義,來減少重工與方便維護 函式內的內容可以放函式 函式定義內容後,需要...

鐵人賽 Software Development DAY 10

技術 Day 10 - Algebraic structure

yo, what's up 本章要來介紹 FP 的重要觀念,Algebraic structure! What's Algebraic structure?...

鐵人賽 Modern Web DAY 12

技術 【Day12】數據展示元件 - Tooltip

元件介紹 Tooltip 是一個文字彈出提醒元件,當 active 狀態時,會顯示對該子元件描述的文字。 參考設計 & 屬性分析 位置 相對於被包覆的子...

鐵人賽 自我挑戰組 DAY 25
JavaScript 核心觀念 系列 第 25

技術 【Day25】閉包進階:工廠模式及私有方法

我們先來看一段閉包程式碼 function arrFunction() { const arr = []; for (var i = 0; i...

鐵人賽 自我挑戰組 DAY 11
開始入坑網頁吧! 系列 第 11

技術 JavaScript Hoisting (提升)

Hoisting 能在宣告變數、函式、物件與其他型別前先進行使用,但是初始化並不會被提升。因為 JavaScript 分成編譯跟執行兩個階段,在編譯階段會把宣告...

鐵人賽 Modern Web DAY 27

技術 #27 JS: Timing Events - Part 1

What is timing event? "JavaScript can be executed in time-intervals. This i...

鐵人賽 Modern Web DAY 16

技術 不只懂 Vue 語法:為什麼需要使用 $nextTick ?

問題回答 $nextTick 的作用是等待畫面更新後才執行程式,因為有些時候我們需要操作畫面上的 DOM,例如是取得某個 DOM 節點的文字、取得某元素的高度等...

鐵人賽 自我挑戰組 DAY 25
JS30 學習日記 系列 第 25

技術 Day 25 - Event Capture, Propagation, Bubbling and Once

前言 JS 30 是由加拿大的全端工程師 Wes Bos 免費提供的 JavaScript 簡單應用課程,課程主打 No Frameworks、No Compi...

鐵人賽 自我挑戰組 DAY 10

技術 [ Day 10 ] - 傳值與傳址

傳值與傳址 先來看案例 案例一 let a = 50; let b = a; console.log (a); // 顯示為 50 console.log(b)...

鐵人賽 Modern Web DAY 10

技術 D3JsDay10 遇到元素資料不相等,用函式解決高人一等

綁定的資料和畫面上的元素不相等 enter()函式—沒放入元素的資料 先看以下程式碼 <body> <div></div&gt...

鐵人賽 Software Development DAY 10

技術 Day 10 :Longest Palindromic Substring

不知道做完 Easy版本的Valid Palindrome看到這一題 Medium版Longest Palindromic Substring 的你有什麼想法?...

鐵人賽 Modern Web DAY 16
入門前端技能之旅 系列 第 16

技術 Day.16 「重複的事情,交給程式去做!」 —— JavaScript 循環迴圈

前面學習到了條件判斷式,接著我們來學習有點危險的循環迴圈,好啦!也沒那麼誇張~只是寫不好,容易進入無窮迴圈導致當機!不過我們是寫在網頁上~所以如果真的不小心陷...

鐵人賽 Modern Web DAY 10
追求JS小姊姊30天 系列 第 10

技術 追求JS小姊姊系列 Day10 -- 如果時間能重來,我不想跟工具人聊天(下)

前情提要 在D特的幫助下,試著穿越時空,但時間碎片湊齊了卻還是出不去,現在該怎辦? 我:...所以我們會永遠困在這嗎?D特:....(沈思樣),我想剛剛會失...

鐵人賽 Modern Web DAY 10
舌尖上的JS 系列 第 10

技術 D10 - 點一籠熱呼呼的小籠閉包 Closure

前言 閉包,一個完全無法從字面意思了解的專有名詞,若是改叫小籠閉包,是不是馬上聯想到這個畫面 一個個湯包被安放在蒸籠中,呼應到閉包在程式碼中的封閉區塊概念,是...

鐵人賽 Modern Web DAY 10

技術 #9-數字動態好棒棒!(Vanilla JS requestAnimationFrame)

品牌常常會有一些數字想要呈現去說服消費者,當然只放靜態的數字就太無聊了,最直覺的動態就是讓數字跑起來! 先來看成果: 今天終於來到了JS動態篇章,比賽也進行1/...

鐵人賽 Modern Web DAY 10

技術 Day 10 - Design System x 實作 — Icon 元件

今天就要來實作 Icon 啦!事不宜遲直接開始! 想先看 Code 或是 Demo 的由此去:Github Repo: ithelp-ui-demoLive D...

鐵人賽 Modern Web DAY 16
我的JavaScript日常 系列 第 16

技術 JavaScript Day 16. 迴圈(for、while、do while、break、continue)

今天要寫的內容,是我完全沒有練習過,也沒有在課堂上學過的方法,那麼為什麼我還是要寫這篇文章呢?原因是因為,即使在我的課程裡 for 迴圈算是被 forEach...