客户端检测

1. 能力检测

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!");
    }
}

1.1 更可靠的能力检测

//不要这样做!这不是能力检测——只检测了是否存在相应的方法
function isSortable(object){
    return !!object.sort;
}

//这样更好:检查 sort 是不是函数
function isSortable(object){
    return typeof object.sort == "function";
}

//在 IE 中会导致错误
var xhr = new ActiveXObject("Microsoft.XMLHttp");
if (xhr.open){ //这里会发生错误
    //执行操作
}

//作者: 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

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

//确定浏览器是否支持 Netscape 风格的插件
var hasNSPlugins = !!(navigator.plugins && navigator.plugins.length);
//确定浏览器是否具有 DOM1 级规定的能力
var hasDOM1 = !!(document.getElementById && document.createElement &&
                             document.getElementsByTagName);
  • 在实际开发中,应该将能力检测作为确定下一步解决方案的依据,而不是用它来判断用户使用的是什么浏览器。

2. 怪癖检测

3. 用户代理检测

3.1 用户代理字符串的历史

3.2 用户代理字符串检测技术

3.3 完整的代码

3.4 使用方法

  • 用户代理检测是客户端检测的最后一个选择。只要可能,都应该优先采用能力检测和怪癖检测。
  • 用户代理检测一般适用于下列情形:
  1. 不能直接准确地使用能力检测或怪癖检测。
    例如,某些浏览器实现了为将来功能预留的存根(stub)函数。
    在这种情况下,仅测试相应的函数是否存在还得不到足够的信息。
  2. 同一款浏览器在不同平台下具备不同的能力。这时候,可能就有必要确定浏览器位于哪个平台下。
  3. 为了跟踪分析等目的需要知道确切的浏览器。
posted @ 2015-12-24 20:24  叫我霍啊啊啊  阅读(170)  评论(0编辑  收藏  举报