理解客户端能力检测

1.为什么需要检测?

通常我们准备使用某个功能时,都是直接使用的,没有使用前检测功能是否存在。因为在我们的理解概念中,都会认为这个功能肯定是存在的,没有必要检测。然而实际情况并不是这样的,比如:addEventListener()的使用。尽管有时候,某个方法都已经成为了标准了,你依然需要检测,因为实际各个浏览器存在一定的差异,标准是这么说的,但是不一定都做到了。

2.理解能力检测

能力检测的目标不是识别特定的浏览器,而是识别浏览器的能力。采用这种方式不必顾及特定的浏览器如何,只要确定浏览器支持的能力如何即可,同时给出解决的方案。

能力检测的方法模式:

if (object.propertyInQuestion){
    //使用object.propertyInQuestion
}

假设你对浏览器是否支持document.querySelector功能不是很确定,那么你在使用前就可以检测一下,并且给出各种情况的方案。

function getElement(selector){//返回给定选择器的元素
    if (document.querySelector){
        return document.querySelector(selector)
    }else{
        throw new Error("NO Way to retrieve element");
    }
    
}

理解能力检测的两个概念:

(1)先检测达成目的的最常用的特性,接下来在坚持那些比较用的少的特性。也就是先检测那些被多数浏览器支持的属性,在来检测被少数支持的。

(2)必须测试要实际用到的特性,一个特性存在,不代表另一个特性存在。比如你要使用对象o的m方法,那你就得检测o.m,而不是检测o,因为o存在,不一定代表o.m存在。

更可靠的能力检测

当需要对某个对象进行操作时,可以使用typeof对其进行检测,判断类型。

原文地址:https://www.cnblogs.com/YeChing/p/6295857.html