JavaScript & jQuery 的應用(一)：概念
其實應該要先介紹一本好書：jQuery in Action(jQuery實戰手冊)
這本書主要是介紹jQuery 在1.2中有哪些重要的function及一些好用的UI Plugin，以及一些在
WEB上面開發需要注意的一些觀念。雖然我jQuery也用了好一陣子了，不過還是著重在他
的強大的選擇器上面，其實很多好用的東西都沒用過。
看完之後，我深深的覺得自己以前寫的CODE真的是有夠醜的，好想重寫哦……
所以我打算這一系列要來簡單的介紹利用jQuery達成一個小小的功能，而且可以體會一下
書裡面提到的一些概念性的東西。
先簡單的介紹書裡面有提的一些重要的概念：
將結構(內文)與樣式表、以及行為分離。這邊有篇文章在說明為什麼要這樣處理：
Understanding Progressive Enhancement (譯文)
另外還有撰寫的七大準則：
The seven rules of Unobtrusive JavaScript (譯文)
2.JavaScript 封裝
其實就是讓JavaScript更具物件導向性，另外一個好處是，當我們在眾多的頁面上使用Javascrip的
時候，很可能會發生名稱衝突的問題，這時候就很難去追查是誰影響誰，所以可以再利用命名空
間(Namespace)加以區隔。
3.各家瀏覽器的相容性
我覺得，jQuery的強大在於他的多重選擇器，另外一點就是跨瀏覽器的組合，這個應該是寫web的
工程師一個心裡的痛。書裡面有舉了個例子，W3C在定義DOM LEVEL2的時候，在監聽事件的觸
發上使用了：
addEventListener(eventType, listener, useCapture)
eventType 事件類型，ex:click, change
listener 觸發的程序
useCapture 指定為capture模式或是bubble模式
但在IE裡面，使用的卻是：
attachEvent(eventName, handler)
eventName 事件名稱，ex:onclick, onchange
handler 觸發的程序
且IE不支援capture模式，這使得我們在開發上有相當大的困擾，但如果利用jQuery，則只要一句：
bind(eventType, data, listener)
就可以輕鬆解決跨平台的問題。
註：如果不知道什麼是Capture和Bubble Mode可以看這裡：Event dispatch and DOM event flow
4.DOCTYPE的重要性
DOCTYPE為什麼重要？因為他會影響排版在各家不同瀏覽器呈現的效果，尤其是IE有分為strict mode
及 quirks mode二種模式。在PPK中有詳細的介紹各家瀏覽器的狀況。
另外，在W3C的Box model中，width及height是不含留白與框線寬度，但是傳統模式是有含的(IE採用傳統模式)
Box model tweaking
所以在網頁的編輯上，最好一定要宣告使用的DOCTYPE。