BOM属性navigator与history与location

2022/1/19 23:25:27

本文主要是介绍BOM属性navigator与history与location,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        console.log(navigator.appName);//淘汰掉的浏览器信息监测

        console.log(navigator.userAgent);//当前的浏览器信息(用户代理)其实等价于当前浏览器
        //用来监测是什么浏览器
        if(/chrome/i.test(navigator.userAgent))//用正则表达式去测试浏览器信息中是否含有chrome字符并忽略大小写
        {
            alert("你是谷歌浏览器");
          //  Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.93 Safari/537.36
            //Mozilla基金会 AppleWebKit/537.36 内核  Gecko 火狐的css解释器
            // like Gecko 是防止单独拎出来识别
            // 微软的ie浏览器就用了很多手段来防止 识别出 ie
        }
        if(/firefox/i.test(navigator.userAgent)){
            alert("你是火狐浏览器");
        }
        //edge其实现在也使用了谷歌的内核会检测出来谷歌浏览器
        if ("ActiveXObject" in window){ //"ActiveXObject" in window 识别这个ActiveXObject是否是 winodw的属性
            // if(!!window.ActiveXObject) !!window.ActiveXObject)强转为布尔值
            //因为这个ActiveXObject是ie中独有的window方法所以再浏览器信息中没有他的话就用这个来识别他是ie
            alert("你是ie11")
        }
        /******************history-***************/
        console.log("history:"+history.length);//浏览器从打开到现在浏览的页面数量
     //   history.forward();//进入到当前浏览器历史的前一个页面
       // history.back();//后退一个页面
       // history.go(-1); -1 就是后退一个页面 -2 -3 *****
        // 1就是前进一个页面
        /******************location***********************/
        //location="https://www.bilibili.com/video/BV1YW411T7GX?p=126";
       // 这种直接赋值location就会跳转页面
      //  location代表了你浏览器当前的浏览网页的url
        //他的属性可以返回url的各种分类;
        //location.assign("https://www.bilibili.com/video/BV1YW411T7GX?p=126");
        //这个方法也是直接对浏览器的跳转
       // location.reload();
        //这个方法会刷新页面 ()中如果加true参数 会刷新浏览器并清除缓存
       // location.replace("https://www.bilibili.com/video/BV1YW411T7GX?p=126");
        //这个方法是替换你网页的url 但不会产生历史记录 无法回退
    </script>
</head>
<body>

</body>
</html>



这篇关于BOM属性navigator与history与location的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程