手機網頁用Bootstrap還是jQuery Mobile

　　很多新手糾結這個問題？兩個框架都能夠支援做手機網頁，那麼它們的區別是什麼呢，適用場景是什麼呢？下面我們從這幾個方面比較這兩個框架：解決問題、功能、適用場景。

　解決問題

　　Bootstrap是一個css框架，針對解決的問題有：

• 跨裝置的網頁響應式佈局問題。隨著手機、平板、各解析度螢幕的出現，如何能夠一套前端在所有裝置上自由適應？
• 多人合作的前端佈局和樣式的規範問題
• 常用前端css元件，如按鈕、連線、表單、表格、分頁元件、下拉選單、導航欄、ICON等等
• 常用JS前端元件（需要擴充套件js支援），如表單驗證、Tips、Popup等等

　　jQuery Mobile是移動前端框架，包含js、html、css，提供一套完整的移動前端開發元件，可以比喻成Android開發框架，儘可能提供移動APP所具有的所有功能，針對解決的問題有：

• 移動網頁APP所常用的元件，例如：手機導航欄、選項卡、底部選單、列表、表單等各種元件，而這些與Bootstrap提供的元件有很大區別，jQuery Mobile提供的是類似手機APP的元件，只用於移動網頁，而Bootstrap提供的是面向所有裝置的元件，並沒有對移動裝置專門考慮，與移動APP的元件體驗不一樣。
• 網頁頁面之間轉換效果
• 非同步資料載入

　功能

　　Bootstrap其核心主要是一個css樣式框架，基於css 的Media Query功能實現了響應式佈局，能夠幫助前端開發人員快速佈局、快速開發、合作開發。它必須藉助jQuery類似的js框架來實現Ajax資料互動。
jQuery Mobile其核心是一個完整的WebAPP框架，加入了一個輕量級的jQuery可以實現Dom操作，在jQuery的基礎上提供了一系列類似移動APP的Widget（檢視元件），提供了一套不錯的頁面轉場效果，可通過Ajax實現與後端資料互動。

　適用場景

　　Bootstrap通常用於：展示網站的響應式佈局開發，使得網站可以在不同裝置上方便瀏覽；以及網站後臺管理系統的前端CSS框架。

　　jQuery Mobile通常用於：期望接近移動APP體驗的WebAPP，專案只執行在手機端，不用於電腦裝置展示（雖然是可以展示的，但是效果不好）。

　總結

　　如果做跨裝置響應式前端，選擇Boostrap；如果僅作移動端，期望得到近似APP的WebAPP，使用jQuery Mobile。

　　如果做一個產品級的WebAPP，當前jQuery Mobile的能力並不能讓你滿意，自己開發響應式佈局框架和WebApp元件是必然要走的路。