之前有介紹了將網頁內容結構化的 HTML
還有將內容排版及美化的 CSS

但這些都不算是程式語言，因為沒有變數、函數、迴圈這些東西可以用
所以這次就來介紹一下網頁上的程式語言

前端與後端

常常聽人說做網頁還要找「前端工程師」、「後端工程師」的
為什麼還要分什麼前後端啊

這是因為網頁的資料不像一般電腦軟體一樣，資料就存在自己電腦裡
而是存在遠方的一台伺服器中
對於在遠方伺服器上處理資料的程式，我們叫他後端程式

┌────┐                      ┌────┐
│ 伺服器 ├── 漫長的網路 ───┤你的電腦│
└────┘                      └────┘
  後端程式                          前端程式

後端程式除了產生整理好的資料外，也會包一份前端程式一起送過來
前端程式是在使用者的瀏覽器上執行

後端語言有 PHP、JSP、ASP …，目前最多人用的後端程式是 PHP
而前端就是 JavaScript，以下簡稱 JS

兩種有什麼不一樣咧？

在古早以前，網頁大部份都只有用到後端程式，例如 PHP。

但網路重送一份網頁過來，可能就要個幾秒鐘，有時候只是想做些簡單的事，像是展開一個選單，像這樣：
    [+]點這展開選單
難道這樣也要把整份網頁重送一次嗎？ 這樣不但浪費頻寬，對使用者的操作感覺也很糟糕

所以就有了前端語言的功用，像是上面那個選單，就是在 HTML 中又加了一段 JS 程式碼，先把藏起來，當點了[+]的按鈕後，再執行 JS 將顯示出來。

如果用訂便當來比喻瀏覽網頁的話

以往都是打電話叫外送後，餐廳就依你的要求送剛好的便當過來。


如果便當少了什麼，以前只能整個退回去重送一份過來。
現在有服務生的話，可以直接要他再回去拿，而你還是一樣吃你的，等他回來後直接加上去就好了。
(AJAX 非同步傳輸技術)

由於現在每個人家裡的廚房愈來愈好了 (使用者的電腦等級、瀏覽器功能愈來愈進步)
有些餐廳的服務生還可以直接帶材料到客人家裡去煮
(部份功能用使用者的電腦來運算，以節省伺服器的負荷)

後端程式，就像是餐廳的廚師，使用者是看不到他的
而前端程式，就是跟便當一起過來的服務生，使用者可以看到他在做什麼
(只要用 右鍵/檢視網頁原始碼 就可以看到 JS 程式在寫什麼了)
所以一些重要的資料，像是食材的密方，就要在餐廳的廚師那邊就處理好，以免被客人偷走

像是有些網頁會鎖右鍵防抓圖，其實一點用都沒有
這樣就像是把東西送你家給你看，然後派一個服務生阻止你把東西收起來
而我們只要把服務生趕出去，東西就隨便你收了

把服務生趕走的方法：

像這樣把 JS 關掉，鎖右鍵就失效了