<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="contain"></div>
    <script>
        var c = document.getElementById("contain");
        c.innerHTML = window.location.href + "<br>" + navigator.userAgent.toLowerCase();

        var br = navigator.userAgent.toLowerCase();
        var browserVer = (br.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || [0, '0'])[1];
        userBrowser();
        function userBrowser() {
            var browserName = navigator.userAgent.toLowerCase();
            if (/msie/i.test(browserName) && !/opera/.test(browserName)) {
                alert("IE");
                return;
            } else if (/firefox/i.test(browserName)) {
                alert("Firefox");
                return;
            } else if (/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName)) {
                alert("Chrome");
                return;
            } else if (/opera/i.test(browserName)) {
                alert("Opera");
                return;
            } else if (/webkit/i.test(browserName) && !(/chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName))) {
                alert("Safari");
                return;
            } else {
                alert("unKnow");
            }
        }
        // alert(navigator.userAgent);
    </script>
</body>

</html>