iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

前端蛇行撞牆記 系列

從自學前端開始,撞上的牆不計其數,所謂獨撞撞不如眾撞撞,只要你搞懂這些牆,你就可以蛇行於這些高牆之中了!

鐵人鍊成 | 共 30 篇文章 | 12 人訂閱 訂閱系列文 RSS系列文 團隊好想工作室 v6.0
DAY 21

Day21 前端蛇行撞牆記 - 好用的 elements.closest()

開始進入DOM的主題了,想介紹一些覺得好用的方法,在操作上可以更加方便。 一般來說如果想要找到某元素的父層,可能會使用Node.parentElement來對父...

2022-10-06 ‧ 由 jadddxx 分享
DAY 22

Day22 前端蛇行撞牆記 - about addEventListener()

前言 一開始在接觸DOM的時候,最重要的就是認識addEventListener(),很簡單地使用就可以達成很多互動。 但是一剛開始學的時候都是仿照別人的寫法去...

2022-10-07 ‧ 由 jadddxx 分享
DAY 23

Day23 前端蛇行撞牆記 - addEventListener() 的參數(上)

前言 昨天大概知道 addEventListener()在幹嘛之後應該玩得不亦樂乎吧?!其實他不只這樣,除了click之外還有更多的event可以去監聽,也不只...

2022-10-08 ‧ 由 jadddxx 分享
DAY 24

Day24 前端蛇行撞牆記 - 製作簡易的檔案拖拉上傳 / drag and drop

前言 今天要來做一個可以使用 input 上傳檔案,也可以 drag and drop 檔案的範例~ 不過現在做的只是可以拿到檔案的名稱顯示而已喔! input...

2022-10-09 ‧ 由 jadddxx 分享
DAY 25

Day25 前端蛇行撞牆記 - addEventListener() 的參數(下)

前言 前天的文章已經有介紹前兩個參數了,今天要來介紹第三個參數 option or useCapture addEventListener(type, lis...

2022-10-10 ‧ 由 jadddxx 分享
DAY 26

Day26 前端蛇行撞牆記 - 在 Vue 3 偵測螢幕尺寸變化 / VueUse及原生JS

前言 在原生裏面,要偵測螢幕尺寸可以使用 window,在 Vue 的 <script> 裡面也可以使用 window 的屬性 innerWidth...

2022-10-11 ‧ 由 jadddxx 分享
DAY 27

Day27 前端蛇行撞牆記 - 表單輸入 input 原生及 v-model 比較 / Vue 3 (上)

前言 自從學了Vue 的 v-model 才發現對原生的 input 行為其實不太了解,而且在 Vue 中的 v-model 幾乎都是用原生的狀態去做出來的,趁...

2022-10-12 ‧ 由 jadddxx 分享
DAY 28

Day28 前端蛇行撞牆記 - input 原生及 v-model 比較 / Vue 3 (下)

input[type=radio] radio都是用在只能單選一項的時候,監聽 change 事件。 原生 因為 radio 只能單選一項,全部的 radio...

2022-10-13 ‧ 由 jadddxx 分享
DAY 29

Day29 前端蛇行撞牆記 - 可不可以給我一篇文章的時間? setTimeout() setInterval()

前言 可不可以給我一篇文章的時間? 來,setTimeout 時間從何而來?有看過星際效應嗎?在不同的星球時間也會不一樣,在 javascript 亦是如此.....

2022-10-14 ‧ 由 jadddxx 分享
DAY 30

Day30 前端蛇行撞牆記 - 30天內發生了什麼事?

我都在做什麼? 其實這次的鐵人賽大約一個月前就在準備文章,開賽的時候已經有 21 篇文章的累積量,想說每天早上直接發文章,還可以有別的進度可以跑。沒想到鐵人賽前...

2022-10-15 ‧ 由 jadddxx 分享