【JS】 JS 中 .min.js 和.js 檔案的區別
JS 中 .min.js 和.js 檔案的區別一、.js和.min.js檔案分別是什麼.js是JavaScript 原始碼檔案， .min.js是壓縮版的js檔案。.min.js檔案經過壓縮，相對編譯前的js檔案體積較小，傳輸效率快。 防止窺視和竊取原始碼 經過編碼將變數和函式原命名改為毫無意義的命名，以防止他人窺視和竊取 js 原始碼
二、 .js 和.min.js檔案的優缺點
TYPE
優點
缺點
.js
可讀性較好，易於debug和更改
體積較大，傳輸時間長
.min.js
體積較小傳輸快, 原始碼防竊
可讀性差
三、 壓縮原理壓縮：刪除 js 程式碼中所有註釋、跳格符號、換行符號及無用的空格，從而壓縮 JS 檔案大小。混淆：經過編碼將變數和函式原命名改為毫無意義的命名，刪除無用程式碼，行內函數，等價語句替換等(以防止他人窺視和竊取原始碼)
【HTML】套件-簡易操作 IntroJs、DriverJs
前言近期整理一些文章，看到還有指引套件部分忘記處理，這邊大概簡述兩個比較常見的套件。以兩種套件來說各有好壞，使用指引套件必須要留意Css可能遇到z-index順序問題，如果是DriverJs部分可能需要注意css方面比較多一些…。
github 範例
[前端軍火庫]Intro.js - 把建好的UI直接變成說明文件
IntroJsIntroJs 是用在 html mark當中，設定上相當簡單、快速 。IntroJs 如果是商業用途可能要索取費用。
安裝
Github : git clone https://github.com/usablica/intro.js.git
npm : npm install intro.js --save
yarn : yarn add intro.js
使用方式依據IntroJs 使用方式，需要設定幾點。
順序 : data-step
內容 : data-intro
提示 : data-hint (必須要配合 introJs().addHints();處理。)
此套件會依據 step 順序呈現下一步提示，如果要使用”提示點”表示，可以使用 ...
【HTML】-何謂 robots.txt
前言許多前端工程師都有相關rebots使用經驗，為了增加 SEO 通常會使用robots，讓使用者可以快速查自己的網站，robots.txt 可以從各樣的網站可以看到。本篇會簡述rebots ，若需要細項說明可以請至下方點選查詢。
robots 簡介robots 是主要功用哪個頁面可以檢索、索引。使用方面會直接影響 SEO 。
何謂 SEO 搜尋引擎最佳化SEO(Search Engine Optimization)，透過搜尋引擎運作規則調整網站，提高網站相關搜尋引擎排名。搜尋引擎針對檢索(Crawl)、索引(Index)的網站資訊，進行演算法排序提供使用者查詢。
robots 使用方式robots 只需要使用 txt 撰寫，必須要留意要使用UTF-8編碼的文字檔。設定方式預設允許所有搜尋引擎檢索所有內容，有兩種做法。
不填入disallow內容12User-agent: *Disallow:
allow 使用 /符號/ : root 根目錄，在這可以解釋從root開始都允許檢索所有檔案。
12User-agent: *Allow: /
檢測方式如果你要查詢網站是 ...
【HTML】-滾動條 Scrollbar
前言近期遇到很多UI介面 scrollbar 都不同樣式或是將 scrollbar 用消失減少版面佔住的機會。可以參考下方滾動條樣式，我再慢慢展示出效果來。
如何讓scrollbar出現第一次用網頁常常遇到 scrollbar 不知道怎樣叫出來，反而不斷跑版。網頁有分父(容器)層跟子(容器)層，當子層超過父層時候，可以使用 overflow。
以下範例 :
123456<body> <div class="container"> <div class="block-1"></div> <div class="block-2"></div> </div></body>
1234567891011121314151617.container{ width: 400px; height: 200px; margin-left: auto; margin-right: ...
【HTML】-Enter Key Hint
前言最近看到有一篇有關EnterKeyHint文章，整個手癢跑去玩玩看，官方說明這方式是針對虛擬鍵盤才會出現的效果，如下面表格:
Keyword
Description
enter
The user agent should present a cue for the operation ‘enter’, typically inserting a new line.
done
The user agent should present a cue for the operation ‘done’, typically meaning there is nothing more to input and the input method editor (IME) will be closed.
go
The user agent should present a cue for the operation ‘go’, typically meaning to take the user to the target of the text they typed.
...
