javascript中BOM对象（二）

javascript中BOM对象（二）

一、location对象

属性：
location.hash：在url中#后面的字符串，如果不存在则为空字符串
location.host:服务器以及端口号：例如：www.wrox.com/80
location.hostname：服务器名，例如：www.wrox.com
location.href：整个url地址
location.pathname:url中的路径和文件名
location.port:端口号
location.protocol:页面使用的协议
location.search:url中的查询字符串
location.origin:url中的源地址。www.wrox.com
查询字符串的封装函数

    let getString = function () {
      let qs = (location.search.length > 0 ? location.search.substring(1) : "");
      let args = {};
      let test = qs.split("&");
      let test_son = test.map(kv =>{
        kv.split("=");
      })
      for(let item of test_son){
        let name = item[0];
        let value = item[1];
        args[name] = value;
      }
      return args;
    }
    

URLSearchParams API
这个API可以对location.search所得的数据进行拆解，可以使用has（）方法判断是否具有某个属性，也可以使用get（）来获取值。
同时这个API也具有迭代接口，所以也可以对其进行迭代。
history.assign（）
加载一个新的文档，可以返回,里面穿url地址
location.reload()
对该页面进行强制刷新，相当于重新从数据库中取出数据
** location.replace() **
相当于取代该文档，不能返回。

navigator对象

1、appCodename返回的是浏览器的代码名

console.log(navigator.appCodeName);    //Mozilla

2、appName返回的是浏览器的名称

console.log(navigator.appName);    //Netscape

3、appVersion 返回的是浏览器的平台和版本

console.log(navigator.appVersion);   //5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36

4、CookieEnabled返回的是否使用cookie的布尔值

console.log(navigator.cookieEnabled);  //true

5、platform 输出的是运行的操作系统

console.log(navigator.platform);  //win32

6、UserAgent 由客户端向服务器发送的user-agent的头部

 console.log(navigator.userAgent);  //Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36

7、javaEnabled()方法 测试浏览器是否支持java,返回布尔值

console.log(navigator.javaEnabled());

8、监测浏览器中是否存在某种插件（IE10以及之前的IE浏览器需要使用ActiveXObject）

    function hasIEPlugin(name) {
      try {
        new ActiveXObject(name);
        return true;
      } catch (ex) {
        return false;
      }
    }
    function hasPlugins(name) {
      name = name.toLowerCase();
      for (let plugin of window.navigator.plugins) {
        if (plugin.name.toLowerCase().indexOf(name) > -1) {
          return true;
        }
      }
      return false;
    }
    // 这里使用两种方法来判断是否存在flash插件
    function hasFlash(){
      var result = hasPlugins("Flash");
      if(result){
        result = hasIEPlugin("ShockwareFlash.ShockwareFlash");
      }
      return result;
    }
    console.log(hasFlash());

screen对象

1、availHeight返回的是可用屏幕的高度 （不包括window任务栏）
2、availWidth返回的是可用屏幕的宽度 （不包括window任务栏）
3、colorDepth //属性返回目标设备或缓冲器上的调色板的比特深度
4、width 屏幕总宽度

history对象

history.pushState():里面传入三个参数，第一个是一个对象（表示状态）,第二个是一个标题字符串，第三个是相对的url地址（），并且这里必须是在开启的服务器页面才会有效，在正常的HTML页面报错。
history.replaceState():替换某一个状态的url
history.popState():将压入栈的状态url弹出，相当于按下左边按钮。
history.go()：里面可以放数字，整数表示前进几页，负数表示后退几页
history.back()：可以使用history.go(-1)表示
history.forword（）:可以用history.go(1)表示
history.length:表示该窗口的页面数
这些方法都是保持页面不刷新，对url进行改变。

本文地址：https://blog.csdn.net/weixin_47450807/article/details/114242352