CSS

        html,body{
height: 100%;
}
body{
margin: 0
}
div{
padding-left: 50px;
}
.span{
padding: 5px 15px;
background: #177ad8;
color: #fff;
font-size: 14px;
text-decoration: none;
border-radius: 7px;
cursor: pointer;
}

HTML

    <div>
<p>点击下面的按钮,查看浏览器信息</p>
<span class="span">点击查看</span>
<p class="seebro"></p>
</div>

JS

var ipspan =document.querySelector(".span");

    function inspect(){
var userAgent=navigator.userAgent; // 火狐浏览器
if(userAgent.indexOf("Firefox") >-1){
return "Firefox";
}
// 谷歌浏览器
if(userAgent.indexOf("Chrome") >-1){
return "Chrome";
}
// IE
if(userAgent.indexOf("IE") >-1){
return "IE";
}
} ipspan.onclick=function(){
document.querySelector(".seebro").innerHTML =inspect();
}

navigator 里面保留的是关于客户机浏览器的信息,不是HTML DOM对象,而是一个JavaScript对象。获取浏览器的字符串,比如google浏览器,那么这个值就是以Chrome开头,Safari浏览器返回的userAgent信息里就包括字符串“Safari”

JS判断浏览器版本的更多相关文章

  1. 利用JS判断浏览器版本

    function checkBrowser() { var browserName = navigator.userAgent.toLowerCase(); //var ua = navigator. ...

  2. jquery判断浏览器版本插件,jquery-browser.js

    jquery判断浏览器版本插件,jquery-browser.js,jquery 判断是否为ie浏览器插件 >>>>>>>>>>>&g ...

  3. JS判断浏览器类型和详细区分IE各版本浏览器

    今天用到JS判断浏览器类型,于是就系统整理了一下,便于后期使用. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  4. js判断浏览器类型以及浏览器版本

    判断浏览器类型:   if navigator.userAgent.indexOf(”MSIE”)>0) {} //判断是否IE浏览器 if(isFirefox=navigator.userAg ...

  5. js实现判断浏览器版本

    //判断浏览器版本是否过低 var ua = navigator.userAgent.toLowerCase(); if (window.ActiveXObject) var IEversion = ...

  6. JS判断浏览器类型及版本

    浏览器 ie firefox opera safari chrome 分类: 一路辛酸---JavaScript 你知道世界上有多少种浏览器吗?除了我们熟知的IE, Firefox, Opera, S ...

  7. 更靠谱的js判断浏览器及其版本

    所有的前端开发人员都没有办法回避一个问题,那就是浏览器版本判断,当我们无法回避需要进行浏览器版本判断时,前辈们往往会告诉我们,可以判断 UserAgent这个用来标示浏览器的字符串,通过判断这一字符串 ...

  8. js判断浏览器类型以及版本

    你知道世界上有多少种浏览器吗?除了我们熟知的IE, Firefox, Opera, Safari四大浏览器之外,世界上还有近百种浏览器. 几天前,浏览器家族有刚诞生了一位小王子,就是Google推出的 ...

  9. js判断浏览器类型 js判断ie6不执行

    js判断浏览器类型 $.browser  对象 $.browser.version 浏览器版本 var binfo = ''; if ($.browser.msie) { binfo = " ...

随机推荐

  1. 架构师养成记--31.Redis的几种类型

    String类型 Redis一共分为五种基本数据类型:String.Hash.List.Set.ZSet String类型是包含很多张类型的特殊类型,并且是二进制安全的.比如对序列化的对象进行存储,比 ...

  2. 通过源码看原理之 selenium

    # selenium的历史1. selenium1.x:这个时候的selenium,使用的是JavaScript注入技术与浏览器打交道,需要Selenium RC启动一个Server,将操作Web元素 ...

  3. hiho#1457 重复旋律7 求子串和 后缀自动机

    题目传送门 题意: 给出若干个串,求所有子串的和,子串和的定义为十进制数,取模1e9+7. 思路: 对于一个串来说,一个状态p就代表着$right$相同的集合,假设我们已经知道了状态p的$sum$,以 ...

  4. Mac 10.12安装IntelliJ出品的数据库管理工具DataGrip

    下载: (链接: https://pan.baidu.com/s/1nvJw88T 密码: srv2) 安装参考: http://www.cnblogs.com/EasonJim/p/7868645. ...

  5. [Xamarin.Android]如何引用JAR檔案 (转帖)

    這個範例是如何在Xamarin.Android中去使用一個我們自行在開發的JAR檔案. 主要會執行的步驟如下 1. 在Xamarin建立一個Android Java Bindings Library ...

  6. (转)生活中的OO智慧——大话面向对象五大原则

    一·单一职责原则(Single-Responsibility Principle) 定义:一个对象应该只包含单一的职责,并且该职责被完整地封装在一个类中. 宿舍里并不能好好学习,自习还是得去图书馆.这 ...

  7. hibernate_SessionFactory_getCurrentSession_JTA简介

    JTA:java transaction  api java里所规定的一种管理事务的API 在另一篇播客我写到了,SessionFactory需要关注两个方法, 即:  openSession     ...

  8. maven开发项目中遇到的问题 StartChild.call at java.util.concurrent.FutureTask.run

    这个原因是没有配置 pom中没有配置 <scope>provided</scope>  导致冲突 正确的配置文件如下 <project xmlns="http: ...

  9. python笔记04-----字典、元组、集合操作

    1.字典 是一种key-value的数据类型,使用就像字典 无序的因为无下标 创建一个字典: info = {     'stu1':'qq',     'stu2':'ww',     'stu3' ...

  10. Http的Get和Post--扫盲篇

    Http Get请求,根据Http规范Get用于服务器信息的获取,而且安全及幂等的.其中安全的在此处的含义是:不会对服务器数据造成修改.增加.以及数据状态的改变. Http Post请求,表示可能修改 ...