首页 » JavaScript » 浏览器能力检测

浏览器能力检测

最常用也是最为人们广泛接受的客户端检测形式是能力检测(又称特性检测)。能力检测的目标不是识别特定的浏览器,而是识别浏览器的能力。能力检测的基本模式如下:

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

举例来说,IE5.0之前的版本不支持document.getElementById()这个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("没有办法检索元素!");
    }
}

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

如果你知道自己的应用程序需要使用某些特定的浏览器特性,那么最好是一次性检测所有相关特性,而不要分别检测。烂下面的例子:

//确定浏览器是否支持Netscape风格的插件
var hasNSPlugins = !! (navigator.plugins && navigator.plugins.length);

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

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

此文章发表在 JavaScript. 将 固定链接 加入收藏.