如何判断你当初浏览器的类型和提供商? DOM和BOM的区别

(1)通过navigator.userAgent获取浏览器的userAgent字符串
(2)然后indexOf去查找各个浏览器名称/浏览器内核的名称,如果返回值不为-1,则该浏览器名称/内核即为你当前手机的手机浏览器/浏览器内核的类型
以pc端为例:

   var userAgent = navigator.userAgent
    if (userAgent.indexOf("Opera")> -1) {
        return "Opera"
    };
    //判断是否Firefox浏览器
    if (userAgent.indexOf("Firefox") > -1) {
        return "FF";
    }
    //判断是否chorme浏览器
    if (userAgent.indexOf("Chrome") > -1){
return "Chrome";
    }
    //判断是否Safari浏览器
    if (userAgent.indexOf("Safari") > -1) {
        return "Safari";
    }
 
var browser = {
  versions: function() {
    var u = navigator.userAgent;
    return {
            trident: u.indexOf('Trident') > -1, //IE内核
            presto: u.indexOf('Presto') > -1, //opera内核
            webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
            gecko: u.indexOf('Firefox') > -1, //火狐内核Gecko
            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
            iPhone: u.indexOf('iPhone') > -1 , //iPhone
            iPad: u.indexOf('iPad') > -1, //iPad
            webApp: u.indexOf('Safari') > -1 //Safari
        };
    }()
}

DOM:Document Object Model (文本对象)文档对象模型,用来获取或设置文档中标签的属性,例如获取或者设置input表单的value值。
BOM:Browser Object Model (浏览器对象) 浏览器对象模型,用来获取或设置浏览器的属性、行为,例如:新建窗口、获取屏幕分辨率、浏览器版本号等。

发布了17 篇原创文章 · 获赞 2 · 访问量 305

猜你喜欢

转载自blog.csdn.net/qq_42628504/article/details/105380255
今日推荐