1、IE6和IE7检测并提醒升级
html:
1 <div class="head">hello!我兼容IE8+,Firefox,Chrome</div> 2 <div class="ie7andie6" style="display:none;"> 3 <div class=‘warning‘> 4 <p>您使用的浏览器版本较低,建议您换用下面这些浏览器试试吧。</p> 5 </div> 6 <ul class="browsers"> 7 <li> 8 <a class=‘ie‘ href="http://windows.microsoft.com/zh-cn/internet-explorer/ie-11-worldwide-languages" target=‘_blank‘>IE11</a> 9 </li> 10 <li> 11 <a class=‘ff‘ href="http://firefox.com.cn/" target=‘_blank‘>Firefox</a> 12 </li> 13 <li> 14 <a class=‘chrome‘ href="http://www.google.cn/intl/zh-CN/chrome/" target=‘_blank‘>Chrome</a> 15 </li> 16 </ul> 17 </div>
css:
1 .head{margin-top:30px;text-align:center;font-size:18px;} 2 .ie7andie6{width:600px;margin:30px auto;text-align:center;} 3 .ie7andie6 .warning{font-size:18px;font-weight:bold;} 4 .warning p{line-height:1.5;} 5 .browsers{margin:20px 0 0;height:148px;} 6 .browsers li{float:left;display:inline;width:128px;height:128px;margin:0 35px;text-align:center;} 7 .browsers li a{display:block;padding-top:128px;*zoom:1;} 8 .browsers .ie{background:url(ie.png) no-repeat;} 9 .browsers .ff{background:url(firefox.png) no-repeat;} 10 .browsers .chrome{background:url(chrome.png) no-repeat;}
js:
1 // 需要先引入jQuery 2 $(function(){ 3 if(window.ActiveXObject){ 4 var browser=navigator.appName; 5 var version=navigator.appVersion; 6 var version=version.split(";"); 7 var trim_Version=version[1].replace(/[ ]/g,""); 8 if(browser=="Microsoft Internet Explorer" && trim_Version=="MSIE6.0" || trim_Version=="MSIE7.0"){ 9 $(".head").hide(); 10 $(".ie7andie6").show(); 11 } 12 } 13 });
提示:在浏览器控制台输入navigator,你可以看到关于浏览器的许多参数。
2、苹果端-安卓端-pc端的检测
js:
1 if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)){ 2 console.log(‘苹果端:‘ + navigator.userAgent); 3 }else if(/(Android)/i.test(navigator.userAgent)) { 4 console.log(‘安卓端:‘ + navigator.userAgent); 5 }else{ 6 console.log(‘pc端:‘ + navigator.userAgent); 7 };
[网上参考]:
通过浏览器navigator判断浏览器版本或者手机类型:http://www.haorooms.com/post/js_navigator_bb
js判断移动端或者pc端或者安卓和苹果浏览器的方法:http://haorooms.com/post/js_pc_iosandmobile
原文:http://www.cnblogs.com/k11590823/p/5084122.html