3个方法实现JavaScript判断移动端及pc端访问不同的网站
3个方法比较简单,分别在页面头部加入如下js代码:
- 对于简单地直接从www.maslinkcom跳转到m.maslink.com,此方法仅从首页而言:
<script>(function () { var url = location.href; // replace www.maslink.com with your domain if ( (url.indexOf(‘www.maslink.com’) != -1) && navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i) ) {location.href = ‘http://m.maslink.com'; } })(); </script> |
2.如果网站除了首页部分,后面跟的还有,比如:www.maslink.com/list/98/,对于这样一个url,PC就直接这样访问了, 对于移动端,只能需要通过m.maslink.com/list/98/才可以呈现出比较好的效果。把http://www替换为http://m,然后 更新页面就可以看到页面在移动端上呈现的效果了。
<script> (function () { var url = location.href; // replace www.maslink.com with your domain if ( (url.indexOf(‘www.maslink.com’) != -1) && navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i) ) {var newUrl = url.replace(‘http://www’, ‘http://m’); location.href = newUrl; } })(); </script> |
3.还有一种方法是在用移动设备访问时给予提示:
<script> var userAgentInfo = navigator.userAgent; var Agents = new Array(“Android”, “iPhone”, “SymbianOS”, “Windows Phone”, “iPad”, “iPod”); var flag = false; var v=0 for ( v = 0; v < Agents.length; v++) { if (userAgentInfo.indexOf(Agents[v]) > 0) { flag = true; break; } } if(flag){ window.location.href=”http://m.maslink.com” alert(Agents[v]);// 设备类型 } else { // pc } </script> |
以上三种方法都是我在试验中验证了的,操作简单,效果明显,希望读者能用得上
HTML5,CSS3,JAVASCRIPT,JQUERY前端开发进阶教程前端开发推送欢迎关注互访!