cari

Rumah >hujung hadapan web >tutorial js >js判断当前打开浏览器的方式

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

小云云
小云云asal
2018-03-07 14:13:101422semak imbas

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

Atas ialah kandungan terperinci js判断当前打开浏览器的方式. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：map和forEach兼容ie6-8方法Artikel seterusnya：2018最新前端面试题六

Artikel berkaitan

Lihat lagi