啊啊學語

 Chrome Dev Tools 中的 element.style，指的是下圖紅框中的東西 就我目前查到的資料，element.style 中的設定，來自兩個地方： 在 html 中設定 style 在 javascript 中設定 style element.style 中的設定，會覆蓋掉原本在 css 中做的設定。如果在做 css 設定時加上 ! important，就不會被覆蓋掉。但是強烈建議避免使用 ! important，因為會蓋過原本「當兩個 style 互相衝突的時候，哪個 style 會優先被套用」的權重計算，增加 debug 的難度。 可以觀察底下這個簡單的 範例 ： See the Pen element.style example by Flora ( @rossignol ) on CodePen . 在 html 中設定 style="color: blue;" 在 javascript 中設定 style.backgroundColor = "yellow" 在 css 中設定： .hi {   border: 3px solid pink;   color: red;   background-color: red; } 參考資料： What is element.style and why is it overriding my css settings?  - stackoverflow How do I find the origin source of an element.style? i.e. Which JS or jQ file is injecting it. I want to fix, not override - stackoverflow  When Using !important is The Right Choice 用 JavaScript 把 element.style 全部覆寫或清空

 科技與社會 數位時代的人權思辨：回溯歷史關鍵，探尋人類與未來科技發展之道 因果革命 物聯網生存指南： 5G世界的安全守則 唐鳳：我所看待的自由與未來 Google地圖革命: 從Google地圖、地球、街景到「精靈寶可夢GO」的科技傳奇內幕 切莫為惡：科技巨頭如何背叛創建初衷和人民 Instagram崛起的內幕與代價：以及它如何改變了文化、商業、科技、媒體，與我們每一個人 Networks of Outrage and Hope: Social Movements in the Internet Age, Edition 2 溝通 你想通了嗎？：解決問題之前，你該思考的6件事 從需求到設計：如何設計出客戶想要的產品（十週年紀念版） 溫伯格的軟體管理學套書（1－4卷） Google模式: 挑戰瘋狂變化世界的經營思維與工作邏輯 心理安全感的力量: 別讓沉默扼殺了你和團隊的未來 MIT最打動人心的溝通課: 組織心理學大師教你謙遜提問的藝術 理解 錯失恐懼：從心理、人際、投資到求職，讓10億人深陷的焦慮陷阱 帶腦去上班 程序開發心理學 (銀年紀念版溫伯格技術思想三部曲) 我如何真確理解世界：漢斯．羅斯林的人生思辨 真確: 扭轉十大直覺偏誤，發現事情比你想的美好 知識的假象: 為什麼我們從未獨立思考？ 技術 改變世界的九大演算法：讓今日電腦無所不能的最強概念 Clean Code -- Udemy 資訊安全 碼書：編碼與解碼的戰爭 The Complete Cyber Security Course : Hackers Ex...

 我在 2020 年 12 月參加了 AlphaCampe 學期 2 -2：軟體開發實務入門，學習用 AJAX串接 API、用 MVC 架構 將程式碼模組化，以及控制程式的流程。 （這份心得是用課程中建議的  ORID 的架構寫的）

 事情是這樣的： 我參加了AlphaCame 學期 2-2（2020 年 12 月開課），課程教我們製作一個翻牌配對點數的遊戲：把一副撲克牌，牌背朝上擺好。每次只能翻開兩張牌，如果翻開的牌點數不一樣 （只看點數，不看花色），一秒後會蓋牌；如果翻開的牌點數一樣，分數加十分。所有的牌都配對完後，遊戲結束。 See the Pen 學期2-2_A15_Memorizing Game by Flora ( @rossignol ) on CodePen . 原本的教案，appendWrongAnimation 函式如下： appendWrongAnimation(...cards) {     cards.map(card => {       card.classList.add('wrong')       card.addEventListener('animationend', event =>         event.classList.remove('wrong'), { once: true })     })   } 我改成下列這樣（修改處以粗體標示）： appendWrongAnimation(...cards) {     cards.map(card => {       card.classList.add('wrong')       card.addEventListener('animationend', event =>          card .classList.remove('wrong'), { once: true })     })   } 當翻開的兩張牌點數不一樣，就會呼叫這個 appendWrongAnimation 函式，幫那兩張牌的外框加上閃爍的特效（在 CSS 中有設定 .wrong 的特效 ），動畫跑完後再把那兩張牌的 class name 改...