target 是一個虛擬類別選擇器，用途在於讓我們設定目標對象的樣式。 CSS 的寫法為： 選擇器：target{ ..... } 也就是當有人點了錨點為 hello 的 a 連結，則透過 #hello:target{……..} 就可以改變 id 為 hello 的 HTML 元素樣式。 在這個範例中必須懂的知識點： 選取 [ 擁有特定屬性 ]的選擇

target 是一個虛擬類別選擇器，用途在於讓我們設定目標對象的樣式。 CSS 的寫法如下： .類別選擇器：target{ ..... } target 基礎應用在這個範例中，我們藉由 <a href="#top"> 來動態地操控 id 是 top 的 HTML 元素樣式。 <a href="#top">

甚麼是 Computed在 Vue 中有一個叫 computed 的神奇方法，它可以觀察在data的變數，一旦變數有了改變，就會去取變數來運算，產生一個新的值呈現在畫面上，而這個新的值不會寫回 Option API 的 data 中。 先來個簡單的計算，看看它神奇的地方：Computed 去觀察 num 跟 price 這兩個資料，一但數值有變化，就算一個新的數值到畫面上。HTML 這樣寫： &l

Vue 指令與表單應用Vue3 的指令可以節省許多原生 JS 要寫的 DOM 元素綁定與事件監聽的語法，Vue 指令方便歸方便，但是如果有些地方沒有注意，表單就有渲染不出來的困擾，以下整理一下初入手 Vue 指令與表單應用要注意的事情。 checkbox 的雙向綁定與渲染在使用 Vue 來做表單渲染與表單選項的雙向綁定時，要注意 v-model 的雙向綁定 與 v-for 的表單選項渲染 是兩件不

一般在寫 HTML 時可以使用 emmet 來幫忙補全 HTML 標籤，但是在 JavaScript 中使用樣版字面值來寫 HTML 就沒有 emmet 可以用，每次寫 HTML 標籤都要自己手打，既不方便也容易出錯。 後來發現在 settings.json 檔中加入幾行 emmet 設定，就可以在寫 JS 樣版字面值時取得 HTML 標籤補全的功能。 請按左下角的齒輪，選擇「設定」： 然後選擇右

箭頭函式的this在 JavaScript 中遇到 this ，有 2 件事情要注意： this 代表的是 function 執行時所屬的物件，而不是 function 本身。 沒有特別指定 this 的情況下，this 預設綁定( Default Binding )「全域物件」，也就是 window。 物件調用與 Simple Call先來看看 simple call 跟物件調用的狀況： v

Hi,我是POPEYE，今天要來談談 getAttribute 與 setAttribute 。 getAttribute 與 setAttribute 是兩個我比較容易混淆的 JS 方法，所以我花了一點工夫來研究一下這兩個方法如何使用。 首先要了解這兩種方法是存取與操作 HTML 標籤屬性的方法，都必須要透過選取到某個 HTML DOM 節點來操作，所以寫法上一定是這樣子： element.ge

這一周六角學院 JS 直播班教的是 C3.js 這個畫圖表的套件。 對於一個畫圖表快二十年的人，看到這個套件感到很親切。不同於手工畫的圖表，C3.js可以透過程式把資料帶入，只要資料更新，圖表也同步更新。 其實我也使用過另外一套圖表套件 Chart.js，那是在前公司結束前，做了一個 COVID-19 的網頁，裡面圖表就是用 Chart.js 做的，那時還不會串 API ，也不會篩選資料，每天都

誤區一：忘記將表單中取出的「數字」由字串轉為數字從 input 中取出的值為「字串」，就算 type=number 取出來的值也是字串，不是數字。 在JS直播班第五周的作業，我就犯了這樣的錯誤。 <input type="number" id="targetInput" value='123'> &

這是六角學院JS直播班第五周作業的檢討。 作業有現成的 HTML 與 CSS模板，是一個旅遊促銷套票的網站，可以新增套票會同步渲染到畫面上。