百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程网 > 正文

能力检测简述 能力测试的方法有哪些

yuyutoo 2024-10-18 12:12 1 浏览 0 评论

最常用也最为人们广泛接受的客户端检测形式是能力检测(又称特性检测)。能力检测的目标不是识别特定的浏览器,而是识别浏览器的能力。采用这种方式不必顾及特定的浏览器如何如何,只要确定浏览器支持特定的能力,就可以给出解决方案。能力检测的基本模式如下:
if (object.propertyInQuestion){
//使用object.propertyInQuestion
}


举例来说,IE5.0之前的版本不支持document.getElementsById()这个DOM方法。尽管可以使用非标准的document.all属性实现相同的目的,但IE的早期版本中确实不存在document.getElementsById()。于是,也就有了类似下面的能力检测代码:
function getElement(id){
if (document.getElementById){
return document.getElementById(id);
} else if (document.all){
return document.all[id];
} else {
throw new Error("No way to retrieve element!");
}
}


这里的getElement()函数的用途是返回具有给定ID的元素。因为document.getElementById()是实现这一目的的标准方式,所以一开始就测试了这个方法。如果该函数存在(不是未定义),则使用该函数。否则,就要继续检测document.all是否存在,如果是,则使用它。如果上述两个特性都不存在(很有可能),则创建并抛出错误,表示这个函数无法使用。


要理解能力检测,首先必须理解两个重要的概念。如前所述,第一个概念就是先检测达成目的的最常用的特性。对前面的例子来说,就是要先检测document.getElementById(),后检测document.all。先检测最常用的特性可以保证代码最优化,因为在多数情况下都可以避免测试多个条件。
第二个重要的概念就是必须测试实际要用到的特性。一个特性存在,不一定意味着另一个特性也存在。来看一个例子:
function getWindowWidth(){
if (document.all){ //假设是IE
return document.documentElement.clientWidth; //错误的用法!!!
} else {
return window.innerWidth;
}
}


这是一个错误使用能力检测的例子。getWindowWidth()函数首先检查document.all是否存在,如果是则返回document.documentElement.clientWidth。第8章曾经讨论过,IE8及之前版本确实不支持window.innerWidth属性。但问题是document.all存在也不一定表示浏览器就是IE。实际上,也可能是Opera;Opera支持document.all,也支持window.innerWidth。


9.1.1 更可靠的能力检测


能力检测对于想知道某个特性是否会按照适当方式行事(而不仅仅是某个特性存在)非常有用。上一节中的例子利用类型转换来确定某个对象成员是否存在,但这样你还是不知道该成员是不是你想要的。来看下面的函数,它用来确定一个对象是否支持排序。
//不要这样做!这不是能力检测——只检测了是否存在相应的方法
function isSortable(object){
return !!object.sort;
}


这个函数通过检测对象是否存在sort()方法,来确定对象是否支持排序。问题是,任何包含sort属性的对象也会返回true。
var result = isSortable({ sort: true });


检测某个属性是否存在并不能确定对象是否支持排序。更好的方式是检测sort是不是一个函数。
//这样更好:检查sort是不是函数
function isSortable(object){
return typeof object.sort == "function";
}


这里的typeof操作符用于确定sort的确是一个函数,因此可以调用它对数据进行排序。
在可能的情况下,要尽量使用typeof进行能力检测。特别是,宿主对象没有义务让typeof返回合理的值。最令人发指的事儿就发生在IE中。大多数浏览器在检测到document.createElement()存在时,都会返回true。
//在IE8及之前版本中不行
function hasCreateElement(){
return typeof document.createElement == "function";
}


在IE8及之前版本中,这个函数返回false,因为typeof document.createElement返回的是"object",而不是"function"。如前所述,DOM对象是宿主对象,IE及更早版本中的宿主对象是通过COM而非JScript实现的。因此,document.createElement()函数确实是一个COM对象,所以typeof才会返回"object"。IE9纠正了这个问题,对所有DOM方法都返回"function"。


关于typeof的行为不标准,IE中还可以举出例子来。ActiveX对象(只有IE支持)与其他对象的行为差异很大。例如,不使用typeof测试某个属性会导致错误,如下所示。
//在IE中会导致错误
var xhr = new ActiveXObject("Microsoft.XMLHttp");
if (xhr.open){ //这里会发生错误
//执行操作
}


像这样直接把函数作为属性访问会导致JavaScript错误。使用typeof操作符会更靠谱一点,但IE对typeof xhr.open会返回"unknown"。这就意味着,在浏览器环境下测试任何对象的某个特性是否存在,要使用下面这个函数。
//作者:Peter Michaux
function isHostMethod(object, property) {
var t = typeof object[property];
return t=='function' ||
(!!(t=='object' && object[property])) ||
t=='unknown';
}


可以像下面这样使用这个函数:
result = isHostMethod(xhr, "open"); //true
result = isHostMethod(xhr, "foo"); //false


目前使用isHostMethod()方法还是比较可靠的,因为它考虑到了浏览器的怪异行为。不过也要注意,宿主对象没有义务保持目前的实现方式不变,也不一定会模仿已有宿主对象的行为。所以,这个函数——以及其他类似函数,都不能百分之百地保证永远可靠。作为开发人员,必须对自己要使用某个功能的风险作出理性的估计。


要想深入了解围绕JavaScript中能力检测的一些观点,请参考Peter Michaux的文章“Feature Detection: State of the Art Browser Scripting”,网址为http://peter.michaux.ca/articles/feature-detection-state-of-the-art-browser-scripting。


9.1.2 能力检测,不是浏览器检测


检测某个或某几个特性并不能够确定浏览器。下面给出的这段代码(或与之差不多的代码)可以在许多网站中看到,这种“浏览器检测”代码就是错误地依赖能力检测的典型示例。
//错误!还不够具体
var isFirefox = !!(navigator.vendor && navigator.vendorSub);


//错误!假设过头了
var isIE = !!(document.all && document.uniqueID);


这两行代码代表了对能力检测的典型误用。以前,确实可以通过检测navigator.vendor和navigator.vendorSub来确定Firefox浏览器。但是,Safari也依葫芦画瓢地实现了相同的属性。于是,这段代码就会导致人们作出错误的判断。为检测IE,代码测试了document.all和document.uniqueID。这就相当于假设IE将来的版本中仍然会继续存在这两个属性,同时还假设其他浏览器都不会实现这两个属性。最后,这两个检测都使用了双逻辑非操作符来得到布尔值(比先存储后访问的效果更好)。


实际上,根据浏览器不同将能力组合起来是更可取的方式。如果你知道自己的应用程序需要使用某些特定的浏览器特性,那么最好是一次性检测所有相关特性,而不要分别检测。看下面的例子。
//确定浏览器是否支持Netscape风格的插件
var hasNSPlugins = !!(navigator.plugins && navigator.plugins.length);


//确定浏览器是否具有DOM1级规定的能力
var hasDOM1 = !!(document.getElementById && document.createElement &&
document.getElementsByTagName);


CapabilitiesDetectionExample01.htm
以上例子展示了两个检测:一个检测浏览器是否支持Netscapte风格的插件;另一个检测浏览器是否具备DOM1级所规定的能力。得到的布尔值可以在以后继续使用,从而节省重新检测能力的时间。


在实际开发中,应该将能力检测作为确定下一步解决方案的依据,而不是用它来判断用户使用的是什么浏览器。


想要了解更多Java基础知识,可以点击评论区链接和小编一起学习java吧,此视频教程为初学者而著,零基础入门篇!给同学们带来全新的Java300集课程啦!java零基础小白自学Java必备优质教程_手把手图解学习Java,让学习成为一种享受_哔哩哔哩_bilibili

相关推荐

Google Chrome 100 Beta发布 用户代理字符串作用开始逐渐降低

GoogleChrome和MozillaFirefox都在迅速接近100版本,这有可能破坏一些错误识别浏览器版本的网站(可能导致访问不正常,这有点类似于众所周知的千年虫)。两种浏览器都在研究可能的...

如何在Chrome,Edge,Safari和Firefox中更改用户代理

无论您是SEO,营销人员还是Web开发人员,通常都可能需要更改浏览器的用户代理以测试其他内容。例如,您正在运行特定于MAC-OS的活动。要确定您的广告系列是否正常运行并且未针对Linux用户,更改浏览...

Mozilla正在测试新的浏览器UserAgent

Mozilla最近发布了一个实验项目来测试3位数的UserAgent版本“Firefox/100.0”会不会让一些网站停止正常工作。浏览器UserAgent是一串字符串,里面包含了浏览器的软件信息,版...

爬虫与User-Agent

什么是User-Agent呢?User-Agent是一个特殊字符串头,被广泛用来标示浏览器客户端的信息,使得服务器能识别客户机使用的操作系统和版本,CPU类型,浏览器及版本,浏览器的渲染引擎,浏览器...

让你的浏览器充满魔性——User Agent Switche

对于前端人员,闲暇时就会研究各种插件,今天我就分享UserAgentSwitcher在Firefox和Chrome的使用情况。一、Firefox浏览器UserAgentSwitcher作为火...

亚马逊账号运营安全-浏览器指纹识别之User-Agent开篇

UA包含了一个约定的特征字符串。主要是面向受访问网络表明自己的操作系统,软件开发商,版本,应用类型等信息。这是一种主动暴露信息的方式。我们来看关于UA的简单语法定义:User-Agent:<p...

【每日学习】Python爬虫之伪装浏览器User-Agent

【主题】Python爬虫之伪装浏览器原理【分析】1.创建自定义请求对象的目的,对抗网站的反爬虫机制2.反爬虫机制1:判断用户是否是浏览器访问(User-Agent)3.对抗措施1:伪装浏览器进行访问【...

亚马逊账号运营安全-浏览器指纹识别之User-Agent二篇

大家好,上一篇亚马逊账号运营安全-浏览器指纹识别之User-Agent开篇为大家阐述了原理。下面是作者为大家整理的其他几个主流浏览器的UA配置。一下都是Windows1064X系统下整理。Chrom...

常见的爬虫UserAgent

通过前面的文章我们知道,UserAgent(用户代理)是HTTP请求的一部分,用于告诉服务器发起请求的客户端类型和属性等信息。同时,也了解了常见的UserAgent。...

HTTP请求头之User-Agent

什么是User-AgentUser-Agent中文名为用户代理,简称UA,...

你想不到的浏览器流氓史!那些奇怪的User-Agent,是这么来的...

平时我们用chrome浏览器做开发测试。Chrome的Useragent字段怎么这么奇怪?...

谷歌宣布 Chrome 将逐步停止支持 User Agent

谷歌近日宣布将放弃对Chrome浏览器中用户代理字符串(User-AgentString)的支持。取而代之的是,Chrome将提供一个名为“客户端提示(ClientHints)”的新API...

数据采集-用户代理(useragent)

UserAgent分类:PC端的UserAgent。移动端UserAgent。使用UserAgent的必要性:在写python网络爬虫程序的时候,经常需要修改UserAgent,有很多原因,罗列几个如...

如何获取当前浏览器的useragent

有时候,我们需要得到浏览器的useragent,从而再进行后面的一系列判断,返回不同的值。网上有说,在浏览器地址栏输入:javascript:alert(navigator.userAgent)这种方...

User Agent 解析:它是什么以及如何修改

什么是UserAgent?UserAgent,简称UA,是一个使服务器能够识别用户使用的浏览器类型、版本以及运行浏览器的操作系统等信息的字符串。它作为浏览器请求头部信息的一部分发送给服务器,以便服务...

取消回复欢迎 发表评论: