欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

javascript中BOM对象(二)

程序员文章站 2022-06-23 09:09:56
javascript中BOM对象(二)一、location对象属性:location.hash:在url中#后面的字符串,如果不存在则为空字符串location.host:服务器以及端口号:例如:www.wrox.com/80location.hostname:服务器名,例如:www.wrox.comlocation.href:整个url地址location.pathname:url中的路径和文件名location.port:端口号location.protocol:页面使用的协议loc...

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