利用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 相关文章推荐
懒就要懒到底——鼠标自动点击(含时间判断)
Feb 20 Javascript
用js 让图片在 div或dl里 居中,底部对齐
Jan 21 Javascript
Jquery easyui 下loaing效果示例代码
Aug 12 Javascript
导航跟随滚动条置顶移动示例代码
Sep 11 Javascript
javascript日期对象格式化为字符串的实现方法
Jan 14 Javascript
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
Nov 30 Javascript
jQuery插件formValidator实现表单验证
May 23 Javascript
Javascript中indexOf()和lastIndexOf应用方法实例
Aug 24 Javascript
jquery Banner轮播选项卡
Dec 26 Javascript
jQuery操作复选框(CheckBox)的取值赋值实现代码
Jan 10 Javascript
JavaScript中使用参数个数实现重载功能
Sep 01 Javascript
记一次用ts+vuecli4重构项目的实现
May 21 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
自制汽车收音机天线:收听广播的技巧和方法
2021/03/02 无线电
基于Discuz security.inc.php代码的深入分析
2013/06/03 PHP
解析phpstorm + xdebug 远程断点调试
2013/06/20 PHP
PHP使用feof()函数读文件的方法
2014/11/07 PHP
js 日期比较相关天数代码
2014/04/02 Javascript
jQuery异步获取json数据方法汇总
2014/12/22 Javascript
jQuery实现左右切换焦点图
2015/04/03 Javascript
Node.js巧妙实现Web应用代码热更新
2015/10/22 Javascript
jquery中取消和绑定hover事件的实现代码
2016/06/02 Javascript
jQuery.form.js插件不能解决连接超时(timeout)的原因分析及解决方法
2016/10/14 Javascript
概述BootStrap中role=&quot;form&quot;及role作用角色
2016/12/08 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
简化版的vue-router实现思路详解
2018/10/19 Javascript
Vue项目安装插件并保存
2019/01/28 Javascript
vue服务端渲染操作简单入门实例分析
2019/08/28 Javascript
Python2/3中urllib库的一些常见用法
2017/12/19 Python
Python实现的FTP通信客户端与服务器端功能示例
2018/03/28 Python
python pandas dataframe 行列选择,切片操作方法
2018/04/10 Python
Python使用Selenium模块模拟浏览器抓取斗鱼直播间信息示例
2018/07/18 Python
python+pygame实现坦克大战
2019/09/10 Python
Python函数式编程指南:对生成器全面讲解
2019/11/19 Python
Python爬虫爬取杭州24时温度并展示操作示例
2020/03/27 Python
python程序输出无内容的解决方式
2020/04/09 Python
Python requests模块安装及使用教程图解
2020/06/30 Python
Python numpy矩阵处理运算工具用法汇总
2020/07/13 Python
BeautifulSoup获取指定class样式的div的实现
2020/12/07 Python
深入理解HTML的FormData对象
2016/05/17 HTML / CSS
在C#中如何实现多态
2014/07/02 面试题
俄语专业毕业生求职信
2014/07/12 职场文书
师德师风个人整改措施
2014/10/27 职场文书
2014年银行年终工作总结
2014/12/19 职场文书
2015年文明创建工作总结
2015/04/30 职场文书
新郎新娘致辞
2015/07/31 职场文书
Python 用户输入和while循环的操作
2021/05/23 Python
AJAX实现指定部分页面刷新效果
2021/10/16 Javascript
《游戏王:大师决斗》新活动上线 若无符合卡组可免费租用
2022/04/13 其他游戏