手机网页用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组件是必然要走的路。

原文发布于微信公众号 - php(phpdaily)

原文发表时间:2016-03-11

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Golang语言社区

【Go 语言社区】算法课程 第一季 第5节 回文检查

回文概念:大致就是把这个数倒过来念数字还是和原来的一样. 运行结果: 代码: package main import ( "fmt" ) //...

3194
来自专栏Jackson0714

JavaScrpit判断横竖屏

1233
来自专栏IMWeb前端团队

Iconfont在教育平台的实践

本文作者:IMWeb bleanycao 原文出处:IMWeb社区 未经同意,禁止转载 Iconfont 体系化解决方案 背景 性能优化是前端开发不得...

2097
来自专栏守候书阁

移动web开发问题和优化小结

到目前为止,互联网行业里,手机越来越智能化,移动端占有的比例越来越高,尤其实在电商,新闻,广告,游戏领域。用户要求越来越高,网站功能越来越好,效果越来越炫酷,这...

1202
来自专栏Android小菜鸡

LayaAir引擎学习经历

  由于公司任务安排,需要笔者先去了解一下LayaAir引擎库,以用来完成公司将要启动的大数据可视化项目,需要借助LayaAir引擎实现复杂的动画。笔者花两天时...

5502
来自专栏Jackson0714

JavaScrpit判断横竖屏

2546
来自专栏天天

20171018

815
来自专栏向治洪

Vuejs和其他前端框架的对比

React React 和 Vue 有许多相似之处,它们都有: 使用 Virtual DOM 提供了响应式 (Reactive) 和组件化 (Composabl...

37410
来自专栏测试2017

test

Markdown 是用来生成 HTML 结构的。样式和结构分离,算是其设计思想之一。而这也是现在 HTML 的发展方向。作为印证,<center> 这样的纯为样...

2150
来自专栏菩提树下的杨过

Flex4中使用HDividedBox,VDividedBox

flex4中推荐使用spark组件来布局,所以在工具箱里把HDividedBox,VDividedBox这二个非常有用的东东给隐藏掉了,只能手动在source视...

19410

扫码关注云+社区