欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

js判断当前打开浏览器的方式

程序员文章站 2022-05-15 22:55:34
...
我们同一个网页,可能会在PC端打开或者不同的移动端打开,那么,我们想要在不同的设备上打开显示不同的效果,就需要知道当前是以什么方式打开的浏览器。Navigator对象提供的属性可以解决这些问题,Navigator对象包含有关浏览器的信息。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>浏览器</title>
</head>
<body>

</body>
<script>
  var browser = {
    versions: function () {
      var u = navigator.userAgent, app = navigator.appVersion;
      return {     //移动终端浏览器版本信息
        trident: u.indexOf('Trident') > -1, //IE内核
        presto: u.indexOf('Presto') > -1, //opera内核
        webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
        gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
        mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
        ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
        android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
        iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
        iPad: u.indexOf('iPad') > -1, //是否iPad
        webApp: u.indexOf('Safari') == -1 //是否web应该程序,没有头部与底部
      };
    }(),
    language: (navigator.browserLanguage || navigator.language).toLowerCase()
  };
  if (browser.versions.mobile) {//判断是否是移动设备打开。browser代码在下面
    var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
    // alert('是在移动端打开');
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
      //在微信中打开
      alert('在微信中打开');
    }
    if (ua.match(/WeiBo/i) == "weibo") {
      在新浪微博客户端打开
    }
    if (ua.match(/QQ/i) == "qq") {
      //在QQ空间打开
      alert('在QQ打开的');
    }
    if (browser.versions.ios) {
      //是否在IOS浏览器打开
      alert('是在IOS浏览器打开');
    }
    if(browser.versions.android){
      //是否在安卓浏览器打开
      alert('是在安卓浏览器打开');
    }
  } else {
    //否则就是PC浏览器打开
    alert('是在pc端打开的');
  }
</script>
</html>

以上就是js判断当前打开浏览器的方式的详细内容,更多请关注其它相关文章!