查看各浏览器的内核

如果你从事前台开发,那么肯定不能少的就是要熟悉各浏览器的内核,那么我们如何知道各浏览器的内核呢?那就得从window.navigator.userAgent入手了。

首先我们写一个自己的Browser对象。

(function(win){

    var // Useragent RegExp

    rwebkit = /(webkit)[ \/]([\w.]+)/,

    ropera = /(opera)(?:.*version)?[ \/]([\w.]+)/,

    rmsie = /(msie) ([\w.]+)/,

    rmozilla = /(mozilla)(?:.*? rv:([\w.]+))?/,

    browserMatch,

    Browser = {},

    userAgent = win.navigator.userAgent;

    

    function uaMatch(ua){

        ua = ua.toLowerCase();



        var match = rwebkit.exec( ua ) ||

            ropera.exec( ua ) ||

            rmsie.exec( ua ) ||

            ua.indexOf("compatible") < 0 && rmozilla.exec( ua ) ||

            [];



        return { browser: match[1] || "", version: match[2] || "0" };

    }

    

    function init()

    {
browserMatch = uaMatch( userAgent ); if ( browserMatch.browser ) { Browser.userAgent = userAgent; Browser.type = browserMatch.browser; Browser[ browserMatch.browser ] = true; Browser.version = browserMatch.version; } } init(); Browser.isChromeOrSafari = function(){ if(Browser.webkit){ return true; } return false; }; Browser.isFirefox = function(){ if(Browser.mozilla){ return true; } return false; }; Browser.isOpera = function(){ if(Browser.opera){ return true; } return false; }; Browser.isMSIE = function(){ if(Browser.msie){ return true; } return false; }; win.Browser = Browser; })(window);

下面我们写个页面测试一下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Insert title here</title>

<script type="text/javascript" src="BrowserType.js"></script>

<script type="text/javascript">

window.print = function(value) {

    document.write(value);

};



window.println = function(value) {

    print(value);

    document.write("<br/>");

};



window.onload = function()

{

    println(Browser.userAgent);

    println(Browser.type + " : " + Browser.version);

    println("IE : " + Browser.isMSIE());

    println("Chrome or Safari : " + Browser.isChromeOrSafari());

    println("Firefox : " + Browser.isFirefox());

    println("Opera : " + Browser.isOpera());

}

</script>

</head>

<body>



</body>

</html>    

在IE下输出如下:

Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.2; .NET4.0C; .NET4.0E)

msie : 9.0

IE : true

Chrome or Safari : false

Firefox : false

Opera : false

在firefox下输出如下:

Mozilla/5.0 (Windows NT 6.1; rv:12.0) Gecko/20100101 Firefox/12.0

mozilla : 12.0

IE : false

Chrome or Safari : false

Firefox : true

Opera : false

在Opera下输出如下:

Opera/9.80 (Windows NT 6.1; U; Edition IBIS; zh-cn) Presto/2.10.289 Version/12.00

opera : 12.00

IE : false

Chrome or Safari : false

Firefox : false

Opera : true

在Chrome下输出如下:

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.162 Safari/535.19

webkit : 535.19

IE : false

Chrome or Safari : true

Firefox : false

Opera : false

在Safari下输出如下:

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/534.57.2 (KHTML, like Gecko) Version/5.1.7 Safari/534.57.2

webkit : 534.57.2

IE : false

Chrome or Safari : true

Firefox : false

Opera : false

在世界之窗极速版下,输出如下:

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.79 Safari/535.11 QIHU THEWORLD

webkit : 535.11

IE : false

Chrome or Safari : true

Firefox : false

Opera : false

在360极速浏览器输出如下:

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.52 Safari/536.5 QIHU 360EE

webkit : 536.5

IE : false

Chrome or Safari : true

Firefox : false

Opera : false

从以上输出结果,可以看出来,webkit有走红的现象,毕竟速度快才是硬道理啊!

你可能感兴趣的:(浏览器)