iT邦幫忙

新手上路相關文章
共有 295 則文章
鐵人賽 自我挑戰組 DAY 8
新手初探 Vue 系列 第 8 篇

技術 鐵人賽Day08 - 動態加上 class

這裡來介紹在 Vue 動態加上 class一樣先把 Vue 的架構先撰寫出來,而目標是想點擊按鈕時會在 .box 自動加上 rotate 這個 class,再點...

鐵人賽 自我挑戰組 DAY 11
新手初探 Vue 系列 第 17 篇

技術 鐵人賽Day18 - props 的型別

在前面我們已經了解了元件,現在我們要來多加說明 props 這個屬性props 是由外而內傳遞資料所使用的屬性有時候我們傳遞的資料也許是需要數值型態來計算的,這...

鐵人賽 自我挑戰組 DAY 11
新手初探 Vue 系列 第 16 篇

技術 鐵人賽Day17 - Vue.js 基礎元件認識 -2

我們在前面講了很長篇幅的元件,那元件可以分為局部註冊跟全域註冊,前面的方式我們都是採用全域註冊,而所謂的全域就是指,當我在新增一個 Vue 的應用程式時,它也可...

鐵人賽 自我挑戰組 DAY 11
新手初探 Vue 系列 第 15 篇

技術 鐵人賽Day16 - Vue.js 基礎元件認識

在 Vue 裡面,我們可以使用元件來動態掛載 HTML而元件到底是什麼? 如果以 HTML 來說的話,就會類似像是 Header Content 這樣一個區塊一...

鐵人賽 自我挑戰組 DAY 7
新手初探 Vue 系列 第 7 篇

技術 鐵人賽Day07 - 修飾符

先前有講到 v-on 和 v-bind 指令v-on 用在事件上,v-bind 用在綁定標籤的屬性上而這些指令其實是有修飾符可以用的,意指縮寫。 拿前面章節的程...

鐵人賽 自我挑戰組 DAY 6
新手初探 Vue 系列 第 6 篇

技術 鐵人賽Day06 - v-on 綁定頁面行為

接下來要來介紹,如何綁定事件,以 click 事件來舉例: <div id="app"> <input type=&q...

鐵人賽 自我挑戰組 DAY 5
新手初探 Vue 系列 第 5 篇

技術 鐵人賽Day05 - v-for & v-if

這篇要來介紹 v-for 和 v-if 這兩個指令相當於 JavaScript 的 for 迴圈跟 if 判斷式一樣先把 Vue 的基本架構寫出來: <d...

鐵人賽 自我挑戰組 DAY 4
新手初探 Vue 系列 第 4 篇

技術 鐵人賽Day04 - v-bind 動態屬性指令

接下來要來介紹一個新的指令 v-bind,它是用來綁定 HTML 標籤的屬性照慣例,Vue 的架構如下: <div id="app"&...

鐵人賽 自我挑戰組 DAY 3
新手初探 Vue 系列 第 3 篇

技術 鐵人賽Day03 - 試著把 Vue 的資料呈現在頁面上

前面一篇我們建立應用程式的時候把資料呈現在頁面上的方法是使用兩個大括號包覆的方式,如下: <div id="app">...

鐵人賽 自我挑戰組 DAY 11
新手初探 Vue 系列 第 14 篇

技術 鐵人賽Day14 - Computed & Watch

接下來要來介紹 Vue 裡面的 computed(計算)& watch(監聽)computed 的運用上,是我們要返回某個值且顯示到頁面上,會用到的舉個...

鐵人賽 自我挑戰組 DAY 2
新手初探 Vue 系列 第 2 篇

技術 鐵人賽Day02 - 在 Vue 建立應用程式

Vue 的引入跟 jQuery 一樣,這裡就不多贅述,版本一樣有壓縮版本跟開發人員版本。當引入好 Vue 之後,我們就可以先來建立第一個應用程式。 首先我們先在...

鐵人賽 自我挑戰組 DAY 1

技術 Day 0 |物件導向到底是蝦米碗糕呢?老闆來碗方向感吧~

還記得一開始自學程式語言時,大家一定或多或少都聽過一個名詞 物件導向。然後身為程式新手和非程式相關科系畢業的你也許會開始 Google 它到底是什麼意思,然後你...

鐵人賽 自我挑戰組 DAY 3
重新開始的Vue.js 30day 系列 第 4 篇

技術 從頭開始的Javascript 入門 -函式 day3

從頭開始的Javascript 入門 -函式 day3 前言 函式是物件 (除了基本型別以外的都是物件) 宣告函式名稱方式常見有兩種:函式宣告(Functio...

技術 寫給選擇障礙的人:我該不該學XX語言、XX框架?

對於初學者,我建議先花時間了解,XX語言主要用來做什麼。你才會知道,XX語言是不是你需要學的。你才會知道,你需要學會XX語言的哪些東西。 真正理解技術或語言背後...

鐵人賽 自我挑戰組 DAY 2
重新開始的Vue.js 30day 系列 第 3 篇

技術 從頭開始的Javascript 入門 -流程控制 Day2

從頭開始的Javascript 入門 -流程控制 Day2 白話解釋就是如果這樣 就會那樣 if...else 條件判斷 var age = 20; if (...

鐵人賽 自我挑戰組 DAY 1
新手初探 Vue 系列 第 1 篇

技術 鐵人賽Day01 - 新手初探 Vue 序

這是我第一次參加鐵人賽,先說目標吧,我想藉由這樣的比賽來提升自己研究技術的能力。過去幾個月的我,把這樣一個重要的能力流失掉了。 我還記得我剛開始接觸 web 的...

技術 JavaScript 基礎知識- 取消預設行為,了解元素所在位置

在某些情況下,我們會想取消元素的預設行為,例如 <a> 標籤的 href 屬性的這個行為,此時 .preventDefault()就是一個非常好用的...

技術 JavaScript 基礎知識-事件氣泡,事件捕捉

這裡要來補充一個小知識,在 .addEventListener() 這個事件監聽的方法,還有第三個參數,只是沒有設定時,預設會是 false即一個元素的點擊事件...

技術 JavaScript基礎知識-事件(2)

前面講到三種事件綁定的方法,撇除掉第一種較危險的方式之外,來談談第二種跟第三種的差異性 以點擊事件為例: <input type="button...

技術 JavaScript基礎知識-事件(1)

終於研究到了事件的部分了,所謂的事件,是當使用者對頁面做出什麼動作的意思,例如:滑鼠點擊,按下鍵盤...之類的,而當使用者有這些動作時,我們又該給予什麼樣式的回...

技術 python [Day2] 基礎教學 -變數

那這邊先聊一下有學過其他語言的一定知道在寫程式中最最最終要的一定就是變數啦~~如果沒有變數就等於要你裝一杯水卻不給你杯子一樣今天就來介紹一下變數首先要了解pyt...

技術 JavaScript 基礎知識-操控 HTML 的方法 .createElement

前面講到了使用 .innerHTML 來操控 HTML,這裡說明第二種方式 .createElement ,後面再說明兩者的差異性 一樣先建立一個名字清單的陣列...

技術 python [Day1] 基礎教學 -安裝anaconda

這邊先個人介紹一下目前工作是在中部某家電子公司當MIS在為明年作準備,這裡是以下小弟的不專業教學再請大家多多交流 首先個人學習的環境是 anaconda 若不想...

技術 JavaScript 基礎知識- .innerHTML 與 for 迴圈的運用

前一篇講到了 .innerHTML 來新增元素以及內容,還有組字串的技巧這邊我們就來建立一個陣列,依序把資料輸入進去吧 首先先建立 HTML 結構: <h...

技術 JavaScript 基礎知識-操控 HTML 的方法 .innerHTML

前面我們講到選取了元素,也講到了設定屬性和讀取屬性,但倘若我們想要在某個元素下再新增元素且有內容時,可以怎麼做?這裡就介紹其中一種方法 .innerHTML 也...

技術 JavaScript 基礎知識-setAttribute & getAttribute

前面講到了選取元素的方法 .querySelector() 和 .querySelectorAll()選取到了元素,我們就可以對他們設定一些屬性,例如設定 id...

技術 JavaScript 基礎知識-querySelectorAll

<h2 class="title"><em></em></h2> <h2 class=...

達標好文 技術 JavaScript 基礎知識-querySelector

第一篇文章有提到可以用 document.getElementById() 的方式選取 id 元素渲染到網頁,但如果今天我想選取的不只是 id 元素,還有 cl...

技術 JavaScript 基礎知識-for 迴圈搭配 break 的運用

當我們在執行 for 迴圈時,如果我們是希望滿足條件後就跳脫迴圈而不要讓迴圈跑完時,這時候就可以搭配 break 來作運用 建立一個陣列資料如下: var fa...

技術 JavaScript 基礎知識-for 迴圈加總

照著前面建立的小鎮和房子的假設走,下面是前篇創建的陣列: var area=[ { house: 'Jerry', ro...