《JavaScript高级程序设计（第3版）》学习笔记33：chapter

本文链接：https://blog.csdn.net/weixin_44582681/article/details/100856744

这是第33篇学习笔记！
让学习“上瘾”，成为更好的自己！！！

一，能力检测

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>能力检测</title>
</head>
<body>


<script>

//【注意】 检测Web客户端的手段有很多，优先使用“通用”的检测方法，不到万不得已，就不要使用客户端检测！！
/**
    能力检测（特性检测）：不是识别特定的浏览器，而是识别浏览器的能力
                        确定浏览器支持的特定的能力，就可以给出解决方案

    本质：检测浏览器是否支持特定的DOM方法



*/
    function getElement(id){
        if(document.getElementById){  
            // 在使用能力检测时，一定要删除方法名后的圆括号，否则，测试的是方法的结果，无论方法是否存在
            return document.getElementById(id);

        } else if(document.all){  // only for IE5之前
            return document.all(id); // 实现与document.getElementById(id)一样的效果

        } else{
            throw new Error('No way to retrieve element!!');
        }

    }
    // 【理解能力检测】
    //  1, 先检测达成目的的最常用的特性，可以保证代码最优化，因为多数情况下都可以避免测试多个条件。如先document.getElementById(id)，再document.all(id)
    //  2, 必须测试实际用到的特性。一个特性存在，不一定意味另一个特性也存在



    // 1, 更可靠的能力检测 
    // 在可能的情况下，尽量使用“typeof”进行能力检测！！
    // 例如：检测一个对象是否支持排序
    function isSortable(obj){
        return typeof obj.sort == 'function';
    }

    // 对于IE，涉及时在来看！！



    // 2, 能力检测，不是浏览器检测 
    // 如果知道应用程序需要使用某些特性的浏览器特性（DOM方法），可以一次性检测所有相关的特性，而不要分开检测

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

    

    // 确定浏览器时候具有DOM1级规定的能力
    // 检测多个方法或者属性是否存在 ==> 逻辑或
    if (!document.getElementById || !document.getElementsByName ){
        return false;
    }



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





</script>



</body>
</html>