利用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 获取LI里的内容
Dec 17 Javascript
JavaScript常用对象的方法和属性小结
Jan 24 Javascript
jquery链式操作的正确使用方法
Jan 06 Javascript
js离开或刷新页面检测(且兼容FF,IE,Chrome)
Mar 05 Javascript
JQuery中属性过滤选择器用法实例分析
May 18 Javascript
Javascript 动态改变imput type属性
Nov 01 Javascript
jQuery自定义组件(导入组件)
Nov 08 Javascript
vue2.0开发实践总结之入门篇
Dec 06 Javascript
解决element UI 自定义传参的问题
Aug 22 Javascript
js Array.slice的8种不同用法示例
Jul 10 Javascript
vue props对象validator自定义函数实例
Nov 13 Javascript
js实现网页随机验证码
Oct 19 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
ASP知识讲座四
2006/10/09 PHP
无数据库的详细域名查询程序PHP版(2)
2006/10/09 PHP
PHP取整函数:ceil,floor,round,intval的区别详细解析
2013/08/31 PHP
PHP加密函数 Javascript/Js 解密函数
2013/09/23 PHP
PHP常量使用的几个需要注意的地方(谨慎使用PHP中的常量)
2014/09/12 PHP
PHP实现网页内容html标签补全和过滤的方法小结【2种方法】
2017/04/27 PHP
javascript 对象定义方法 简单易学
2009/03/22 Javascript
javascript 匿名函数的理解(透彻版)
2010/01/28 Javascript
JavaScript Event学习第六章 事件的访问
2010/02/07 Javascript
javascript删除字符串最后一个字符
2014/01/14 Javascript
用Node.js通过sitemap.xml批量抓取美女图片
2015/05/28 Javascript
jQuery带进度条全屏图片轮播特效代码分享
2020/06/28 Javascript
第一次接触神奇的Bootstrap表单
2016/07/27 Javascript
浅谈js中的变量名和函数名重名
2017/02/13 Javascript
vue代理和跨域问题的解决
2018/07/18 Javascript
JavaScript中为事件指定处理程序的五种方式分析
2018/07/27 Javascript
Node.js 路由的实现方法
2019/06/05 Javascript
[54:29]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第二场
2018/04/09 DOTA
python 简单的绘图工具turtle使用详解
2017/06/21 Python
ubuntu17.4下为python和python3装上pip的方法
2018/06/12 Python
Django框架搭建的简易图书信息网站案例
2019/05/25 Python
解决Python3 抓取微信账单信息问题
2019/07/19 Python
python数据类型之间怎么转换技巧分享
2019/08/20 Python
python logging.info在终端没输出的解决
2020/05/12 Python
python 获取谷歌浏览器保存的密码
2021/01/06 Python
解决Pyinstaller打包软件失败的一个坑
2021/03/04 Python
迪斯尼商品官方网站:ShopDisney
2016/08/01 全球购物
临床医学专业学生的自我评价分享
2013/11/21 职场文书
班组建设经验交流材料
2014/05/12 职场文书
群众路线教育实践活动民主生活会个人检查对照思想汇报
2014/10/04 职场文书
文明单位创建材料
2014/12/24 职场文书
小学班主任评语
2014/12/29 职场文书
先进教师个人总结
2015/02/11 职场文书
工作证明书
2015/06/15 职场文书
MySQL主从搭建(多主一从)的实现思路与步骤
2021/05/13 MySQL
十大最强格斗系宝可梦,超梦X仅排第十,第二最重格斗礼仪
2022/03/18 日漫