《JavaScript高级程序设计（第3版）》学习笔记32：chapter_8 - 3 navigator对象，screen对象，history对象

最新推荐文章于 2020-03-18 20:45:01 发布

壹小楷

最新推荐文章于 2020-03-18 20:45:01 发布

阅读量140

点赞数

分类专栏： JavaScript高级程序设计学习笔记文章标签： navigator对象 JavaScript 学习总结 screen对象 history对象

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

版权

JavaScript高级程序设计学习笔记专栏收录该内容

43 篇文章 0 订阅

订阅专栏

让学习“上瘾”，成为更好的自己！！！

一，navigator对象

<!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>navigator对象</title>
    <script>
        /*
            

        1，检测插件
            a, 检测浏览器是否安装了特定的插件是一种最常见的检测例程！！
            b, plugins数组：
                name：插件名
                description：插件描述
                filename：插件的文件名
                length: 插件所处理MIME类型的数量
                refresh()方法：用于刷新plugins以反映最新安装的插件
                               接收一个参数，若为true，则重新加载包含插件的所有页面
                                            否则，只更新plugins集合，不重新加载页面




        2，注册处理程序（FireFox）(见下)


            
            
            */
        // 检测插件
        // 检测浏览器是否安装了特定的插件是一种最常见的检测例程！！
        // 检测插件时，需要像下边这样循环迭代每个插件并将插件的name 与指定的名字进行比较
        function hasPlugin(name){  // 接收一个要检测的插件的名字
            var name = name.toLowerCase();
            for(var i = 0;i < navigator.plugins.length ;i ++){
                if(navigator.plugins[i].name.toLowerCase().indexOf(name) > -1){
                    return true;

                }
            }
            return false;
        }
        // 上边这种，可以在 Firefox, Safari, Chrome, Opera使用


        // 对于IE
        // 检测插件的唯一方式：使用专有的ActiveXObject()类型，并尝试创建一个特定的插件的实例。
        // IE是以“COM对象”的方法实现插件的，而COM对象使用唯一的标识符来标识。
        // 因此，要想检测插件，就必须知道其COM标识符，例如Flash的标识符就是ShockwaveFlash.ShockwaveFlash
        function HasIEPlugin(name){
            try{
                new ActiveXObject(name);  // 创建未知COM对象会导致抛出错误，所以用“try-catch”
                return true;
            } catch(ex){
                return false;
            }

        }
        //     // 检测 Flash
        //     console.log(HasIEPlugin('ShockwaveFlash.ShockwaveFlash'));

        // 针对每个插件分别插件检测函数（基于以上的问题）【重要！！】
            // 检测所有浏览器中的Flash
            function hasFlash(){
                var result = hasPlugin('Flash');
                if(!result){
                    result = HasIEPlugin('ShockwaveFlash.ShockwaveFlash');
                }
                return result;
            }

             // 检测所有浏览器中的QuickTime
            function hasQuickTime(){
                var result = hasPlugin('QuickTime');
                if(!result){
                    result = HasIEPlugin('QuickTime.QuickTime');
                }
                return result;
            }
           

            //  2，注册处理程序（FireFox 2）
            //  指明站点可以处理的特定类型的信息（下边两个方法）
            // navigator.registerContentHandler() and registerProtocolHandler()




    </script>
</head>

<body>

</body>

</html>

二，screen对象
因本部分内容在实际开发中较少涉及，所以不多介绍！待需要时翻阅书籍即可！

三，history对象

<!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>history对象</title>
    <script>
        /*
         1，history对象保存着用户上网的历史记录，从窗口被打开的那一刻算起   
         2，history对象是window对象的属性
         3，go()方法：在用户的历史记录中任意跳转，接收一个参数，可以向前或向后，正数表示“向前”，负数表示“向后”
         4，back()   and   forward()
         5，用户访问过的页面列表

            
            
            */
        // （1）参数是数值
            // history.go(1);  // 前进一页

            // history.ho(-2);  // 后退两页



        // （2）参数是字符串：浏览器会跳转到历史记录中包含该字符串的第一个位置--可能前进，或者后退。如果没有包含该字符串，则该方法什么事都不做
        // history.go('wrox.com');  // 跳转到最近的wrox.com页面

        // // back()  and forward()
        // history.back();  // 后退一页

        // history.forward();  // 前进一页

        // length属性：保存历史记录的数量
        // 对于加载到窗口、标签页或框架中的第一个页面而言，history.length等于0
        
        



    </script>
</head>

<body>
    <input type="button" name="" id="" value="前进"> <br>
    <input type="button" name="" id="" value="后退"> <br>
    <a href="https://www.baidu.com" >百度</a> <br>
    <a href="https://www.tencent.com" >腾讯</a><br>
    <a href="https://www.taobao.com" >淘宝</a><br>

    <script>
        var btn1 = document.getElementsByTagName('input')[0];
        var btn2 = document.getElementsByTagName('input')[1];
        btn1.onclick = function(){
            history.forward();
        };
        btn2.onclick = function(){
            history.back();
        };
    
    </script>

    
</body>

</html>

壹小楷

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
《JavaScript高级程序设计（第3版）》学习笔记32：chapter_8 - 3 navigator对象，screen对象，history对象

让学习“上瘾”，成为更好的自己！！！<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...
复制链接

扫一扫