利用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将NodeList作为Array数组处理的方法
Jul 09 Javascript
JS打开图片另存为对话框实现代码
Dec 26 Javascript
使用JavaScript动态设置样式实现代码(2)
Jan 25 Javascript
js保留两位小数使用toFixed实现
Jul 29 Javascript
jQuery对于显示和隐藏等常用状态的判断方法
Dec 13 Javascript
jQuery使用$.ajax提交表单完整实例
Dec 11 Javascript
jQuery form插件之ajaxForm()和ajaxSubmit()的可选参数项对象
Jan 23 Javascript
Bootstrap编写导航栏和登陆框
May 30 Javascript
微信小程序如何获取用户信息
Jan 26 Javascript
解决layui数据表格Date日期格式的回显Object的问题
Sep 19 Javascript
antd日期选择器禁止选择当天之前的时间操作
Oct 29 Javascript
vue项目中的支付功能实现(微信支付和支付宝支付)
Feb 18 Vue.js
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
JpGraph php柱状图使用介绍
2011/08/23 PHP
PHP实现redis限制单ip、单用户的访问次数功能示例
2018/06/16 PHP
ThinkPHP5&amp;5.1实现验证码的生成、使用及点击刷新功能示例
2020/02/07 PHP
JS之小练习代码
2008/10/12 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
2011/09/29 Javascript
解析Javascript中中括号“[]”的多义性
2013/12/03 Javascript
jQuery设置指定网页元素宽度和高度的方法
2015/03/25 Javascript
JavaScript Window浏览器对象模型方法与属性汇总
2015/04/20 Javascript
你所未知的3种Node.js代码优化方式
2016/02/25 Javascript
JavaScript中输出信息的方法(信息确认框-提示输入框-文档流输出)
2016/06/12 Javascript
详解jQuery简单的表格应用
2016/12/16 Javascript
VUE中v-model和v-for指令详解
2017/06/23 Javascript
详解koa2学习中使用 async 、await、promise解决异步的问题
2018/11/13 Javascript
解决vue跨域axios异步通信问题
2019/04/17 Javascript
微信小程序自定义弹窗滚动与页面滚动冲突的解决方法
2019/07/16 Javascript
Python变量和字符串详解
2017/04/29 Python
Python3多线程操作简单示例
2018/05/22 Python
浅谈Python 列表字典赋值的陷阱
2019/01/20 Python
解决Pytorch 训练与测试时爆显存(out of memory)的问题
2019/08/20 Python
Python搭建代理IP池实现存储IP的方法
2019/10/27 Python
Python实现aes加密解密多种方法解析
2020/05/15 Python
PyQT5 实现快捷键复制表格数据的方法示例
2020/06/19 Python
哥伦比亚最大的网上商店:Linio哥伦比亚
2016/09/25 全球购物
在weblogic中发布ejb需涉及到哪些配置文件
2012/01/17 面试题
大班上学期幼儿评语
2014/04/30 职场文书
乐观自信演讲稿范文
2014/05/21 职场文书
毕业大学生自荐信
2014/06/17 职场文书
第二批党的群众路线教育实践活动总结报告
2014/10/30 职场文书
2014年安全工作总结范文
2014/11/13 职场文书
会计稽核岗位职责
2015/04/13 职场文书
团支部组织委员竞选稿
2015/11/21 职场文书
2016年习主席讲话学习心得体会
2016/01/20 职场文书
幼儿园家长心得体会
2016/01/21 职场文书
安装pytorch时报sslerror错误的解决方案
2021/05/17 Python
手把手教你从零开始react+antd搭建项目
2021/06/03 Javascript
postgresql 删除重复数据案例详解
2021/08/02 PostgreSQL