美文网首页
location对象

location对象

作者: 幽涯 | 来源:发表于2017-10-10 16:30 被阅读0次

    一、属性

    • hash:返回URL中的hash(#后跟零个或多个字符),若没有则返回空字符串;
    • host/hostname:返回服务器名称和端口号/服务器名称;
    • port:返回URL中指定端口号,若无指定返回空字符串;
    • href:返回当前加载页完整URL(location.toString()也返回这个);
    • pathname:返回URL中的目录和文件名;
    • protocol:返回当前页面使用协议;
    • search:返回URL中以问号开头的查询字符串(若无则返回空字符串);

    二、查询字符串参数

    function getParams() {
      var qs = (location.search.length > 0 ? location.search.substring(1) : '');
      if (!qs.length) return {};
      var args = {},
          items = qs.split('&'),
          item = null,
          name = null,
          value = null;
      for (var i = 0; i < items.length; i++) {
        item = items[i].split('=');
        name = decodeURIComponent(item[0]);
        value = decodeURIComponent(item[1]);
        if (name.length) args[name] = value;
      }
      return args;
    }
    

    三、位置操作

    1、修改页面url(跳转到新页面)

    • location.assign(urlString)
      立即打开一个新的url并在浏览器历史记录中生成一条记录;
    • window.location = urlString;
      location.href = urlString;
      以上两个方法也是调用了 assign() 方法;
    • 此外,修改location的其他属性也可改变当前加载页面(只是不常用);

    Tips: 以上修改都会生成一条新的历史记录,可通过点击后退按钮回到上一页;

    2、替换页面url(替换当前页)

    location.replace(urlString);
    该方法会将当前页面改变,且不生成新的历史记录,相当于替换了当前页;

    3、重新加载当前页

    location.reload();
    如果不传任何参数则刷新重载当前页;(有可能从缓存中加载)
    如果传入 true 则强制从服务器从新加载;(从服务器从新加载)

    相关文章

      网友评论

          本文标题:location对象

          本文链接:https://www.haomeiwen.com/subject/kszvyxtx.html