DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 前端技巧 >> 手機網頁wap用Bootstrap還是jQuery Mobile
手機網頁wap用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組件是必然要走的路。

最近我們手機端網站想改版,打算用bootstrap做移動端開發的,但經過網上很多人的反饋來看boostrap比較大,他應該說是pc與移動一體自適應的情況下用,如果單純的做移動站沒必要,用這麼臃腫的東西。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved