-
Notifications
You must be signed in to change notification settings - Fork 74
/
Copy pathbrowser_info.html
89 lines (85 loc) · 4.06 KB
/
browser_info.html
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html>
<head>
<meta name="renderer" content="webkit">
<!-- <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1"/> -->
<meta charset="utf-8">
<title>
浏览器信息
</title>
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="./iconfont/iconfontDemo/demo.css">
<script type="text/javascript" src="utils/client.js"></script>
<style>
a:hover{
text-decoration: none;
}
a{
color: #cb9c64;
}
</style>
</head>
<body>
<div class="main markdown">
<h1>浏览器信息</h1>
<ul>
<li>
<h3>1.您的浏览器版本是：<span id="browserInfoTxt"></span></h3>
</li>
<li>
<h3>2.主流浏览器内核介绍</h3>
<ul>
<li>Chrome浏览器：28.0.1469.0版本前是WebKit内核（html_css渲染：WebCore + 脚本渲染：v8），后续版本：Blink内核； </li>
<li>IE浏览器：IE6~IE11使用的是Trident内核，win10开始自带的浏览器Edge, 内核：EdgeHTML内核；（IE9开始脚本渲染使用Chakra引擎）</li>
<li>Firefox浏览器： Gecko内核；(脚本渲染引擎：22以上版本 OdinMonkey引擎)</li>
<li>Safari浏览器： WebKit内核；（基于KHTML, html_css渲染：WebCore + 脚本渲染：JSCore）</li>
<li>Opera浏览器： 4~6使用Elektra内核，7~15使用Presto内核，15~now 使用Blink内核；（10.50版本开始脚本渲染使用：Carakan）</li>
</ul>
</li>
<li>
<h3>3.IE浏览器：“浏览器模式”、“文档模式”</h3>
<ul>
<li>“浏览器模式”：发送给网站服务器的用户代理（User-Agent）字符串的值，告诉后台服务器当前浏览器版本信息； </li>
<li>“文档模式”：用于指定IE的页面排版引擎（Trident）以哪个版本的方式来解析并渲染网页代码。</li>
</ul>
</li>
<li>
<h3>4.参考网址：</h3>
<ul>
<li><a href="http://www.cnblogs.com/vajoy/p/3735553.html" target="_blank">博客园：主流浏览器内核介绍 </a></li>
<li><a href="https://www.zhihu.com/question/29985708" target="_blank">知乎：如何评价Edge浏览器 </a></li>
<li><a href="http://www.ruanyifeng.com/blog/2015/09/web-page-performance-in-depth.html" target="_blank">阮一峰：网页性能管理详解 </a></li>
<li><a href="https://zhuanlan.zhihu.com/p/27628685" target="_blank">知乎专栏：认识V8引擎 </a></li>
</ul>
</li>
</ul>
</div>
<script>
var browserInfoDom = document.getElementById('browserInfoTxt');
var browserName = '',
browserVersion = 0;
try {
if (client && client.browser) {
if (client.browser.chrome) {
browserName = '谷歌浏览器：Chrome';
} else if (client.browser.firefox) {
browserName = '火狐浏览器：Firefox';
} else if (client.browser.ie) {
browserName = '微软浏览器：IE';
} else if (client.browser.opera) {
browserName = '欧朋浏览器：Opera';
} else if (client.browser.safari) {
browserName = '苹果浏览器：Safari';
} else {
browserName = '未知浏览器';
}
browserVersion = client.browser.ver;
}
} catch (e){
browserInfoDom.innerHTML = browserName + ', 版本：' + browserVersion;
}
browserInfoDom.innerHTML = browserName + ', 版本：' + browserVersion;
</script>
</body>
</html>