利用Javascript判断操作系统的类型实现不同操作系统下的兼容性


Posted in Javascript onJanuary 29, 2013

在通过Javascript实现客户端和服务端的交互时,有时候需要对操作系统进行判断,以便实现不同操作系统下的兼容性,比如:我们有一个网站, 在Windows XP下浏览效果良好,但是到了Ubuntu下,由于许多特性不同,会造成在浏览上的细微差异,甚至会影响到良好的用户体验。这个时候我们就需要利用 Javascript对操作系统的类型以及某些特性进行判断,分而治之,从而实现网站在跨平台浏览时候保持良好的用户体验。
下边的代码实现对Windows、Mac、Linux、Unix擦作系统的判断:

<script type="text/javascript" language="JavaScript"> 
<!-- 
function check_os() { 
windows = (navigator.userAgent.indexOf("Windows",0) != -1)?1:0; 
mac = (navigator.userAgent.indexOf("mac",0) != -1)?1:0; 
linux = (navigator.userAgent.indexOf("Linux",0) != -1)?1:0; 
unix = (navigator.userAgent.indexOf("X11",0) != -1)?1:0; 
if (windows) os_type = "MS Windows"; 
else if (mac) os_type = "Apple mac"; 
else if (linux) os_type = "Lunix"; 
else if (unix) os_type = "Unix"; 
return os_type; 
} 
//--> 
</script>

如果我们需要对Windows操作系统进行更为精确的识别,可以继续使用下边的代码操作:
<script type="text/javascript" language="JavaScript"> 
<!-- 
var isWin = (navigator.platform == "Win32") || (navigator.platform == "Windows"); // 确保为windows系统 
var isWin98 = isWin2000 = isWinXP = false; 
var sUserAgent = navigator.userAgent; 
if(isWin) { 
isWin98=sUserAgent.indexOf("Win98") > -1 || sUserAgent.indexOf("Windows 98") > -1; // win98 
isWin2000=sUserAgent.indexOf("Windows NT 5.0") > -1 || sUserAgent.indexOf("Windows 2000") > -1; //win2000 
isWinXP=sUserAgent.indexOf("Windows NT 5.1") > -1 || sUserAgent.indexOf("Windows Xp") > -1; //winxp 
isWin98 && alert("window 98"); 
isWin2000 && alert("windows 2000"); 
isWinXP && alert("windows XP"); 
} 
//--> 
</script>

下边的代码是为了实现对浏览器是否支持XML特性的检测:
<script type="text/javascript" language="JavaScript"> 
var SupportXml=false; 
var xmldom; 
if(window.ActiveXObject) { 
try { 
xmldom=new ActiveXObject("Microsoft.XMLDOM"); 
SupportXml=(xmldom.loadXML(" <ok/>")); 
} catch(e) {} 
} 
else if(document.implementation && document.implementation.createDocument) { 
SupportXml=true; 
} 
alert('XML状态为:'+SupportXml); 
</script>

PS:为了更好地避免不同浏览器,不同操作系统因为默认文字不同而对页面布局造成影响,应尽量避免CSS中使用固定行高(height:12px;)对 文字高度进行限定,应该尽量使用height:auto,如果迫不得已必须限定文字高度(比如只显示一行),则应使用em代替px(例如 height:1.1em;),1em=1文字高度,这样就使得文字高度随着文字大小动态改变,不会造成文字截断现象的发生了。
Javascript 相关文章推荐
使用javascript实现json数据以csv格式下载
Jan 09 Javascript
Jquery获取第一个子元素简单实例
Jun 02 Javascript
jQuery模仿京东/天猫商品左侧分类导航菜单效果
Jun 29 Javascript
jQuery validate插件功能与用法详解
Dec 15 Javascript
vue使用$emit时,父组件无法监听到子组件的事件实例
Feb 26 Javascript
vue中v-model的应用及使用详解
Jun 27 Javascript
深入浅析AngularJs模版与v-bind
Jul 06 Javascript
JS实现动态生成html table表格的方法分析
Jul 11 Javascript
axios对请求各种异常情况处理的封装方法
Sep 25 Javascript
vue中使用vue-cli接入融云实现即时通信
Apr 19 Javascript
微信小程序 授权登录详解(附完整源码)
Aug 23 Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
Apr 07 Javascript
js的压缩及jquery压缩探讨(提高页面加载性能/保护劳动成果)
Jan 29 #Javascript
JavaScript起点(严格模式深度了解)
Jan 28 #Javascript
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 #Javascript
JavaScript转换农历类实现及调用方法
Jan 27 #Javascript
Extjs中TabPane如何嵌套在其他网页中实现思路及代码
Jan 27 #Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
Jan 27 #Javascript
jQuery ajax serialize()方法的使用以及常见问题解决
Jan 27 #Javascript
You might like
thinkPHP数据查询常用方法总结【select,find,getField,query】
2017/03/15 PHP
Display SQL Server Login Mode
2007/06/21 Javascript
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
2012/01/21 Javascript
利用jquery的获取JS文件中的字符串内容
2012/02/14 Javascript
jQuery侧边栏随窗口滚动实现方法
2013/03/04 Javascript
jquery插件validate验证的小例子
2013/05/08 Javascript
js中点击空白区域时文本框与隐藏层的显示与影藏问题
2013/08/26 Javascript
jquery选择checked在ie8普通模式下的问题
2014/02/12 Javascript
JavaScript实现汉字转换为拼音的库文件示例
2016/12/22 Javascript
vue+vue-validator 表单验证功能的实现代码
2017/11/13 Javascript
Vue实现搜索结果高亮显示关键字
2019/05/28 Javascript
JavaScript 格式化数字、金额、千分位、保留几位小数、舍入舍去
2019/07/23 Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
2019/09/11 Javascript
node.js使用fs读取文件出错的解决方案
2019/10/23 Javascript
JS实现网页烟花动画效果
2020/03/10 Javascript
[06:45]DOTA2卡尔工作室 英雄介绍幻影长矛手篇
2013/07/12 DOTA
[01:20:47]DOTA2-DPC中国联赛 正赛 Ehome vs Magma BO3 第一场 1月19日
2021/03/11 DOTA
纯Python开发的nosql数据库CodernityDB介绍和使用实例
2014/10/23 Python
几个提升Python运行效率的方法之间的对比
2015/04/03 Python
python中装饰器级连的使用方法示例
2017/09/29 Python
使用python生成杨辉三角形的示例代码
2018/08/29 Python
基于Python3.6+splinter实现自动抢火车票
2018/09/25 Python
python性能测量工具cProfile使用解析
2019/09/26 Python
Python常用库Numpy进行矩阵运算详解
2020/07/21 Python
一款纯css3制作的2015年元旦雪人动画特效教程
2014/12/29 HTML / CSS
美国现代家具和家居商店:Apt2B
2016/08/29 全球购物
如何利用cmp命令比较文件
2016/04/11 面试题
员工自我鉴定范文
2013/10/06 职场文书
群众路线教育实践活动方案
2014/02/02 职场文书
节约电力资源的建议书
2014/03/12 职场文书
售房委托书
2014/08/30 职场文书
2014小学教师个人工作总结
2014/11/10 职场文书
遗失证明范文
2015/06/19 职场文书
青年干部培训班学习心得体会
2016/01/06 职场文书
话题作文之自信作文
2019/11/15 职场文书
Nginx配置之禁止指定IP访问
2022/05/02 Servers