0

0

JS中特性与UA检测

php中世界最好的语言

php中世界最好的语言

发布时间:2018-06-04 10:52:00

|

4140人浏览过

|

来源于php中文网

原创

这次给大家带来JS中特性与UA检测,JS中特性与UA检测的注意事项有哪些,下面就是实战案例,一起来看一下。

最早的浏览器嗅探即用户代理(user-agent)检测,服务端(以及后来的客户端)根据user-agent字符串来确定浏览器的类型。在此期间,服务器会完全根据user-agent字符串屏蔽某些特定的浏览器查看网站内容。其中获益最大的浏览器就是网景浏览器。不可否认,网景(在当时)是最强大的浏览器,以至于很多网站都认为只有网景浏览器才会正常展现他们的网页。网景浏览器的user-agent字符串是Mozilla/2.0 (Win95; I)。当IE首次发布,基本上就被迫沿用了网景浏览器user-agent字符串的很大一部分,以此确保服务器能够为这款新的浏览器提供服务。因为绝大多数的用户代理检测的过程都是查找“Mozilla”字符串和斜线之后的版本号,IE浏览器的user-agent字符串设置成Mozilla/2.0 (compatible; MSIE 3.0; Windows 95),是不是觉得很鸡贼。IE采用了这样的用户代理字符串,这意味着每个浏览器类型检测也会把这款新的浏览器识别为网景的Navigator浏览器。这也使得新生浏览器部分复制现有浏览器用户代理字符串成为了一种趋势。Chrome发行版的用户代理字符串包含了Safari的一部分,而Safari的用户代理字符串又相应包含了Firefox的一部分,Firefox又依次包含了Netscape(网景)用户代理字符串的一部分。

基于UA检测是极其不靠谱的,并且维护困难,UA可以伪造,一个声明为Chrome的浏览器它可能是其他浏览器

每次有新的浏览器出现,或者已有的浏览器版本升级,原先基于UA检测的代码都要更新,维护成本和出错几率极大

所以我建议你尽可能避免检测UA,即使在不得不这样做的情况下。

2.8.2 特性检测

我们希望有一种更聪明的基于浏览器条件(进行检测)的方法,于是一种叫特性检测的技术变得流行起来。特性检测的原理是为特定浏览器的特性进行测试,并仅当特性存在时即可应用特性检测,例如:

// 不好的写法if (navigator.userAgent.indexOf("MSIE 7") > -1) { }// 好的写法if (
document
.getElementById) {}

因为特性检测不依赖于所使用的浏览器,而仅仅依据特性是否存在,所以并不一定需要新浏览器的支持。例如,在DOM早期的时候,并非所有浏览器都支持document.getElementById(),所以根据ID获取元素的代码看起来就有些冗余。

// 好的写法// 仅为举例说明特性检测,现代浏览器都支持getElementByIdfunction getById (id) {  var el = null;  if (document.getElementById) { // DOM
    el = document.getElementById(id);
  } else if (document.all) { // IE
    el = document.all[id];
  } else if (document.layers) { // Netscape <= 4
    el = document.layers[id];
  }  return el;
}

这种方法同样适用于当今最新的浏览器特性检测,浏览器已经实验性地实现了这些最新的特性,而规范还正在最后确定中。常见的Polyfill就是特性检测的应用,例如:

if (!Array.isArray) {  Array.isArray = function (arr) {    return 
Object
.prototype.toString.call(arr) === '[object Array]'
  }
}

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

web开发中如何避免空比较

web开发中UI层的松耦合

相关专题

更多
php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

7

2025.12.31

php网站源码教程大全
php网站源码教程大全

本专题整合了php网站源码相关教程,阅读专题下面的文章了解更多详细内容。

4

2025.12.31

视频文件格式
视频文件格式

本专题整合了视频文件格式相关内容,阅读专题下面的文章了解更多详细内容。

7

2025.12.31

不受国内限制的浏览器大全
不受国内限制的浏览器大全

想找真正自由、无限制的上网体验?本合集精选2025年最开放、隐私强、访问无阻的浏览器App,涵盖Tor、Brave、Via、X浏览器、Mullvad等高自由度工具。支持自定义搜索引擎、广告拦截、隐身模式及全球网站无障碍访问,部分更具备防追踪、去谷歌化、双内核切换等高级功能。无论日常浏览、隐私保护还是突破地域限制,总有一款适合你!

7

2025.12.31

出现404解决方法大全
出现404解决方法大全

本专题整合了404错误解决方法大全,阅读专题下面的文章了解更多详细内容。

42

2025.12.31

html5怎么播放视频
html5怎么播放视频

想让网页流畅播放视频?本合集详解HTML5视频播放核心方法!涵盖<video>标签基础用法、多格式兼容(MP4/WebM/OGV)、自定义播放控件、响应式适配及常见浏览器兼容问题解决方案。无需插件,纯前端实现高清视频嵌入,助你快速打造现代化网页视频体验。

4

2025.12.31

关闭win10系统自动更新教程大全
关闭win10系统自动更新教程大全

本专题整合了关闭win10系统自动更新教程大全,阅读专题下面的文章了解更多详细内容。

3

2025.12.31

阻止电脑自动安装软件教程
阻止电脑自动安装软件教程

本专题整合了阻止电脑自动安装软件教程,阅读专题下面的文章了解更多详细教程。

3

2025.12.31

html5怎么使用
html5怎么使用

想快速上手HTML5开发?本合集为你整理最实用的HTML5使用指南!涵盖HTML5基础语法、主流框架(如Bootstrap、Vue、React)集成方法,以及无需安装、直接在线编辑运行的平台推荐(如CodePen、JSFiddle)。无论你是新手还是进阶开发者,都能轻松掌握HTML5网页制作、响应式布局与交互功能开发,零配置开启高效前端编程之旅!

2

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 3.1万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 1.9万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号