iT邦幫忙

前端新手村相關文章
共有 335 則文章

技術 鼠年全馬鐵人挑戰 WEEK 22: JavaScript 判斷式 - if...else / switch

小明崩潰問道:難道奶奶、你和我都是程式所構成的嗎?此時大家陷入沉默,不發一語黑衣人打破沉默:如果你想知道這世界的真相,就問問真理吧!在真理的世界只有 true...

技術 [快速入門前端 46] JavaScript:迴圈 (1) for 、while、do while 簡介

迴圈 迴圈 (Loop),是指在符合條件下重複執行某區塊內的程式直到條件結束 (為 true)主要分為 while、do while 和 for 三種類型,下面...

鐵人賽 Modern Web DAY 23

技術 類別封裝 ( Class Encapsulation )

類別封裝是一種將類別的內部細節隱藏起來,確保類別的屬性和方法在外部程式碼中不被隨意訪問,提高程式碼的可維護性和可讀性,同時提供了一定程度的安全性。 存取修飾符...

技術 [快速入門前端 66] JavaScript:事件 (2) Event 和事件解綁

event 是什麼 在這邊這個 event 指的不是事件本身,而是 event listener 的一個「Event Object」,裡面會有所有關於這個事件的...

鐵人賽 自我挑戰組 DAY 30

技術 新手村30 - Whack A Mole

30 - Whack A Mole 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small steps...

鐵人賽 Modern Web DAY 25
實作經典 JavaScript 30 系列 第 25

技術 Day25: Adding Up Times With Reduce

WES BOS系列影片Alex快速導讀系列影片 今天的練習會用到reduce()還有用一些數學的運算,將秒數換算成時分秒然後又複習了一下dataset的用法事不...

鐵人賽 自我挑戰組 DAY 3
小白網頁設計練成記 系列 第 3

技術 小白網頁設計練成記-DAY3-淺談HTML 元素

HTML裡面的文檔都是由元素定義的,每個元素的組合和串聯就形成一個網頁的結構,舉例來說:<P></p>代表"段落",...

鐵人賽 自我挑戰組 DAY 1
溫故知新 JavaScript 系列 第 1

技術 Day1 - 前奏

HI 大家好,我是 AWEI首次參加IT邦鐵人賽,這次想透過 30 天的時間帶大家一起來認識 JavaScript ,至於為什麼會叫溫故知新JavaScript...

鐵人賽 自我挑戰組 DAY 10

技術 Day10 - ES6 Set 實作聯集、交集和差集

嗨大家好,我是Eric ~今天我們來談談一個非常實用的主題:如何用 JavaScript 實作集合的基本操作。集合是數學中的一個基本概念,也在程式設計中扮演著重...

鐵人賽 自我挑戰組 DAY 13

技術 新手村13 - Slide in on Scroll

13 - Slide in on Scroll 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small...

鐵人賽 自我挑戰組 DAY 5

技術 新手村05 - Flex Panel Gallery

05 - Flex Panel Gallery 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small...

技術 鼠年全馬鐵人挑戰 WEEK 20: JavaScript 函式 function

小明是某雜貨店的員工,有天店裡來了位客人,身著國民品牌uniqlo黑色的短T,下著百搭卡其褲,腳採萬年不敗adidas拖鞋,走進店裡拿了一罐水、二條七七乳加巧克...

技術 [快速入門前端 56] JavaScript:Array 陣列 (3) 常見陣列操作方法

常見操作方法 在 上篇 陣列相關文章中我們已經大致了解簡單的操作方法,但其實在 JavaScript 陣列中還有更多元的方法可以使用,不過有些牽涉到 Funct...

鐵人賽 Modern Web DAY 21
實作經典 JavaScript 30 系列 第 21

技術 Day21: LocalStorage(ㄧ)

WES BOS系列影片Alex快速導讀系列影片 今天要來認識LocalStorage看不太懂的話,這裡也有一篇我覺得寫得很好理解的筆記可以參考localStor...

鐵人賽 Modern Web DAY 17

技術 void VS. never

在上一個章節中,我們知道如果函式沒有返回值的話,可以使用 void 型別,今天我們來比較 void 和 never 的不同的情境和用途,雖然它們看起來相似,但它...

鐵人賽 自我挑戰組 DAY 4

技術 Day 04 HTML<表單標籤>

表單標籤主要功用是用來收集使用者資料 常用情況 : 註冊頁面... 主要由 表單域、表單元素、提示文字 這三種內容組成 以MOMO註冊頁面為範例: 1.表單域...

鐵人賽 自我挑戰組 DAY 8

技術 Day 08 CSS <文本屬性>

CSS Text 屬性可定義文本的外觀例如 : 文本的顏色、對齊文本、裝飾文本、文本縮進、行間距 1.文本顏色 color用於定義文本的顏色 div{ col...

鐵人賽 自我挑戰組 DAY 2
小白網頁設計練成記 系列 第 2

技術 小白網頁設計練成記-DAY2-HTML介绍

HTML 又名超文本標記語言(Hyper Text Markup Languge)不是一種編程語言,而是一種創建網路的標記語言,因電腦沒有眼睛沒有鼻子,所以在創...

鐵人賽 Modern Web DAY 20
33歲轉職者的前端筆記 系列 第 20

技術 33歲轉職者的前端筆記-DAY 20 Javascript 基本知識筆記

寫Javascript前必要小知識 1.&lt;!DOCTYPE html&gt; 為 HTML 5 的語言格式2.head 是網路爬蟲爬的區塊,可以放很多資訊...

鐵人賽 Modern Web DAY 23
實作經典 JavaScript 30 系列 第 23

技術 Day23: Mouse Move Shadow

WES BOS系列影片Alex快速導讀系列影片 今天的練習重點是抓取DOM容器的座標與mousemove事件我們要做一個文字陰影與滑鼠互動的效果要做出這個效果,...

技術 前端相關知識

前端語言 HTML(骨架)(看官方文件) CSS(美編)(看官方文件) Tailwind CSS - Rapidly build modern websi...

鐵人賽 Modern Web DAY 24

技術 模組 & 命名空間 ( Modules & Namespaces )

相信使用 ES6 的小夥伴們對模組都不陌生,現代前端框架也都使用模組在運作。而模組和命名空間是兩種組織和封裝程式碼的方式,雖然它們都有類似的目標,但它們在某些方...

技術 鼠年全馬鐵人挑戰 WEEK 15: 上上 下下 左左 右右 要怎麼解決呢? CSS nth-child

最近切版常常遇到看似規則,但又不規則,一下偏左,一下偏右,在我還沒遇到nth-child 前,我的解決方式都是一千零一招,複製貼上各個class,每次邊貼心裡都...

鐵人賽 自我挑戰組 DAY 17

技術 Day 17 CSS <用戶介面樣式 & 三角>

什麼是介面樣式? 所謂的介面樣式,就是更改一些用戶操作樣式,以提高用戶體驗。 更改用戶的鼠標樣式 語法 : li { cursor : pointer;...

鐵人賽 Modern Web DAY 22
鉄人28号FX 系列 第 22

技術 鉄人28号FX 鉄人22号「速記豹」font properties

★ 地圖雷奧鎮近郊處 ↓↓↓ 顯示雷奧鎮位置圖 就在那了!! ( 抬頭一看 ) 只要再往東走,就能順利到達城鎮~~ :站住!! 近郊衛士 [速記豹]: 此為進入...

技術 鼠年全馬鐵人挑戰 WEEK 21: JavaScript 箭頭函式 Arrow function

奶奶一臉震驚說:你...你是...黑衣人說:我這次回來是要把我畢生所學給傳授下去。小明腦中出現了很多想法,回來?畢生所學?什麼東西阿!搞得我腦子好亂!黑衣人說:...

鐵人賽 自我挑戰組 DAY 30

技術 Day 30 JavaScript < 簡易數據類型介紹 & End>

1. 數據類型簡介 1-1 為什麼需要數據類型 在電腦中,不同的數據所需佔用的空間是不同的,為了方便把數據分成所需內存大小不同的數據,充分利用儲存空間,於是定...

鐵人賽 自我挑戰組 DAY 29

技術 Day 29 JavaScript < 書寫方式>

JavaScript書寫方式與CSS相似,分為行內書寫,內嵌書寫以及外部書寫 1.行內書寫 &lt;input type=&quot;button&quot;...

鐵人賽 自我挑戰組 DAY 28

技術 Day 28 JavaScript < 簡單介紹>

1.JS是什麼? Java Script 是一種運行在客戶端的腳本語言 (script就是腳本的意思) 腳本語言 : 不需要進行編譯,運行過程中由JS引擎逐行來...

鐵人賽 自我挑戰組 DAY 3

技術 Day 03 HTML<列表標籤>

列表標籤可以用來為頁面進行布局 主要分為無序列表、有序列表、自定義列表三大類 1.無序列表無序列表主要使用的標籤如下蘋果香蕉鳳梨水蜜桃哈密瓜無序列表 使用無序列...