javascript之BOM对象(二location对象)

Posted 生如夏花2017

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript之BOM对象(二location对象)相关的知识,希望对你有一定的参考价值。

一、location对象提供和当前加载的文档相关的信息还有一些导航功能。location对象是window对象的属性,同时也是document对象的属性。window.location和document.location指向同一个对象。

location对象不仅保存着当前文档的信息,还可以将URL解析为独立的字段,可以通过不同的属性访问这些片段。

location的所有属性如下

属性名 例子 说明
hash #contents 返回URL中的hash(#号后跟0个或多个字符)
host localhost:8080 返回服务器名称和端口号
hostname localhost 返回服务器名称
href http://www.baidu.com 返回当前加载页面的完整URL
pathname /TyspV4D/ 返回当前URL的目录
port 8080 返回URL中指定的端口号
protocol http 返回URL中使用的协议
search ?q=javascript 返回URL中的查询字符串

 

1、查询字符串参数

location.search()可以返回从?到URL末尾的所有字符串,但没有办法逐个访问其中查询字符串的参数。为此可以创建下面的函数:

function queryStringParam()
      {
        var qs=(location.search.length>0?location.search.substring(1):"");
        args={};
        items=qs.length?qs.spilt("&"):[];//spilt函数是将字符串用特定的符号分开,返回一个数组,这儿返回的是字符串数组
        item=null;
        name=null;
        value=null;
        i=0;
        while(i<items.length)
        {
          item=items[i].spilt("=");//在这儿是用“=”将字符串的键和值分离
          name=decodeURLComponent(item[0]);//解码
          value=decodeURLComponent(item[1]);
          if(name.length)
          {
            args[name]=value;
          }
        }
        return args;

      }
  • 先用substring函数去掉“?”
  • 用spilt(“&”)将字符串分离为键值对
  • 用spilt(“=”)分离键值
  • 最后取出键和值

2、网址操作

location可以使用很多方式改变浏览器打开的网址,即改变打开的URL值。

首先,最常用的方法时用location调用assgin函数并为其传递一个URL参数。

location.assign("http://www.baidu.com");

使用上面的方法会在历史记录生成一条记录。如果是以window.location=”http://www.baidu.com”和location.href=”http://www.baidu.com”也会调用assgin方法。

location.href是最常用的方法。

修改location对象的其他属性也可以改变当前页的URL。

除了修改hash属性外修改其他属性页面都会重新加载

 

 

通过上面这些方式修改URL之后都会在历史记录中生成一条新纪录,这样也就可以通过返回键返回上一页面。那么要是不想使用返回键,就可以使用replace方法,该方法只接受一个URL参数,然后转到该URL页面

setTimeout(function(){
        location.replace("http://www.google.com");  
      },5000);

在上面的代码中,5s之后就会转到google主页,并且不能返回到原来页面,历史记录中也没有生成上一页面。

 

reload函数如果不接受参数,则是以最节省资源的方式重新加载页面,这样就有可能从浏览器缓存中加载

如果要强制从服务器加载的话就要传递参数true。

reload()//从浏览器加载

reload(true)//从服务器加载

以上是关于javascript之BOM对象(二location对象)的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript之BOM

JavaScript之 ------ 浏览器对象模型 (BOM)

javaScript之DOM,BOM

javascript-之-BOM 浏览器对象模型( BOM 的核心--window)

javascript之BOM对象(三其他对象)

JavaScript宿主对象之BOM和DOM