移动端web出现的一系列问题
今天做移动端的web,在做后期处理的时候,发现了非常多的问题。下面我分别列举一下吧~~
1.移动端浏览器众多,各种浏览器之间的显示等都有差异,很多需要单独处理,于是我需要判断分别是什么浏览器。js代码如下:

var NV = {};
var UA = navigator.userAgent.toLowerCase();
try {
NV.shell=(UA.indexOf('ucbrowser')>-1)?'UC浏览器': //ucbrowser
(UA.indexOf('dolphin')>-1)?'海豚浏览器': //dolphinbrowsercn
(UA.indexOf('huohou')>-1)?'火猴浏览器': //huohoubrowser
(UA.indexOf('sogou')>-1)?'搜狗浏览器': //sogoumse/sogoumobilebrowser
(UA.indexOf('opr')>-1)?'欧朋浏览器': //opr
(UA.indexOf('qqbrowser')>-1)?'QQ浏览器': //mqqbrowser
(UA.indexOf('liebao')>-1)?'猎豹浏览器': //liebaofast
(UA.indexOf('2345')>-1)?'2345浏览器': //mb2345browser
(UA.indexOf('miui')>-1)?'小米浏览器': //miuibrowser
(UA.indexOf('baidu')>-1)?'百度浏览器':
(UA.indexOf('aoyou')>-1)?'遨游浏览器':
(UA.indexOf('theworld')>-1)?'世界之窗浏览器':
(UA.indexOf('worldchrome')>-1)?'世界之窗极速浏览器':
(UA.indexOf('greenbrowser')>-1)?'绿色浏览器':
(UA.indexOf('360ee')>-1)?'360极速浏览器':
(UA.indexOf('360se')>-1)?'360安全浏览器':
'未知或无壳';
}catch(e){}
alert('浏览器UA='+UA+'\n\n浏览器外壳='+NV.shell);

上面后面有备注的是亲测过的完全版的名称。
2.有一些浏览器的极速模式,或者某些极速浏览器都不支持js,于是得判断是否支持js。我并没有发现可以判断的方法,但是发现了以下的方法。代码如下:
<noscript>Sorry, your browser does not support JavaScript!</noscript>
但是运用这个的时候很难实现优雅降级,很多的就一棒子打死,但是鉴于没有其他的好办法可以暂时先这么用。
移动端web出现的一系列问题的更多相关文章
- 移动端 Web 开发前端知识整理
文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...
- 移动端web开发的一些知识点
整理一下自己平时移动端web开发中遇到的问题,也参考一下前辈的一些总结 1.最常见的要数1像素边框了 因为Retine屏的分辨率始终是普通屏幕的2倍,1px的边框在dpr=2的retina屏下会显示成 ...
- 【超级干货】手机移动端WEB资源整合
meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wid ...
- 手机移动端WEB资源整合
meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-wid ...
- 【前端】移动端Web开发学习笔记【2】 & flex布局
上一篇:移动端Web开发学习笔记[1] meta标签 width设置的是layout viewport 的宽度 initial-scale=1.0 自带 width=device-width 最佳实践 ...
- 【前端】移动端Web开发学习笔记【1】
下一篇:移动端Web开发学习笔记[2] Part 1: 两篇重要的博客 有两篇翻译过来的博客值得一看: 两个viewport的故事(第一部分) 两个viewport的故事(第二部分) 这两篇博客探讨了 ...
- 移动端web开发基础概念
最近在了解移动端web开发的相关知识,有些概念总是模糊不清,这次花费了一些时间整体的梳理了一遍. 分辨率 分辨率可以从显示分辨率与图像分辨率两个方向来分类.显示分辨率(屏幕分辨率)是屏幕图像的精密度, ...
- 移动端WEB页面
百度前端技术学院第一阶段任务十一,关于移动端WEB页面布局,参考资料如下(都是一些网页链接): MDN:手机网页开发 MDN:在移动浏览器中使用viewport元标签控制布局 移动前端开发和 Web ...
- 移动端web开发进阶
三个月前曾写过一篇跨终端响应式页面设计入门的博客,上了博客园头条也得到了不少关注,今天想在这篇博客的基础上,继续写一篇进阶的文章. 补充 基于“入门”一文,我想再补充几个基础知识点,主要都是针对iOS ...
随机推荐
- 对jsp可见域的变量感悟
page 变量当前页面有效 reqeust 某次请求中的变量有效 session 某次会话中的变量有效 application 全站有效 page<request<session< ...
- C++Primer 第十一章
//1.关键容器支持高效的关键字查找和访问. map 关联数组:保存关键字-值对.通过关键字来查找值. set 关键字即值,即只保存关键字的容器. multimap 关键字可重复出现的map mult ...
- PHP和JS实现多按钮提交表单
JS: <html> <head> <script> function submitit1() //交由程序1处理 { document.myForm.action ...
- ACdream 1104 瑶瑶想找回文串(SplayTree + Hash + 二分)
Problem Description 刚学完后缀数组求回文串的瑶瑶(tsyao)想到了另一个问题:如果能够对字符串做一些修改,怎么在每次询问时知道以某个字符为中心的最长回文串长度呢?因为瑶瑶整天只知 ...
- bzoj1758 [Wc2010]重建计划 & bzoj2599 [IOI2011]Race
两题都是树分治. 1758这题可以二分答案avgvalue,因为avgvalue=Σv(e)/s,因此二分后只需要判断Σv(e)-s*avgvalue是否大于等于0,若大于等于0则调整二分下界,否则调 ...
- 关于设置oracle中系统编号SYSID自动编号的问题;
http://liye9801.blog.163.com/blog/static/601970320086210039591/ 如何在oracle里设置自动编号列 2008-07-21 12:00:3 ...
- 夺命雷公狗—angularjs—2—模拟表单验证
这里我们就来借助妹子ui来搭建下模版,废话不多说,代码如下图所示: <!doctype html> <html lang="en"> <head> ...
- C语言判断一个数是否是素数
素数又称质数.所谓素数是指除了1和它本身以外,不能被任何整数整除的数,例如17就是素数,因为它不能被2~16的任一整数整除. 思路1):因此判断一个整数m是否是素数,只需把m被 2 ~ m-1 之间的 ...
- [php笔记]项目开发五个阶段/雇员管理系统
zend 公司,管理PHP版本的升级. 功能强大, 官方推荐. (开发一个PHP项目) 软件开发的五个阶段. 1.创建一个项目(工程)2.设置该项目的路径3.创建一个文件test.php ***使用Z ...
- (一)MapReduce篇之InputFormat,InputSplit,RecordReader(转)
平时我们写MapReduce程序的时候,在设置输入格式的时候,总会调用形如job.setInputFormatClass(KeyValueTextInputFormat.class);来保证输入文件按 ...