zoukankan      html  css  js  c++  java
  • js的location对象

    js的location对象

    location基础知识

    BOM(浏览器对象模型)中最有用的对象之一就是location,它是window对象和document对象的属性。location对象表示载入窗口的URL,此外,它还可以解析URL:
    href     设置或返回完整的 URL
    protocol     设置或返回当前 URL 的协议,即双斜杠(//)之前的部分。
    host     设置或返回主机名和当前 URL 的端口号。
    hostname     设置或返回当前 URL 的主机名。
    port     设置或返回当前 URL 的端口号。默认情况下,大多数URL没有端口信息(默认为80端口),所以该属性通常是空白的。像http://cardtest.ffan.com:8070/app/ffanbao/location.html这样的URL的port属性为8070.
    pathname     设置或返回当前 URL 的路径部分。
    hash     设置或返回从井号 (#) 开始的 URL(锚)。
    search     设置或返回从问号 (?) 开始的 URL(查询部分)。
    location.origin:协议名、主机名和端口号

    例子:http://cardtest.ffan.com:8070/app/ffanbao/location.html?name=78&age=19#89

    location.href是最常用的属性,用于获取或设置窗口的URL,改变该属性,就可以跳转到新的页面:

    [html] view plain copy
     
    1. <script type="text/javascript">    
    2.     location.href = "http://www.sunchis.com";    
    3. </script>   

    上面代码的作用是:打开页面后将会跳转到http://www.sunchis.com的页面。
    assign()方法也可实现上述操作:

    [html] view plain copy
     
    1. <script type="text/javascript">    
    2.     location.assign("http://www.sunchis.com");    
    3. </script>  

    如果不想让包含脚本的页面能从浏览器的历史记录中访问,replace()方法可以做到这一点。replace()方法所做的操作与assign()方法一样,但它多了一步操作,即从浏览器的历史记录中删除了包含脚本的页面,这样就不能通过浏览器的后退按钮和前进按钮来访问它了,assign()方法却可以通过后退按钮来访问上个页面。你可以自己测试一下这段关于replace()方法的代码:

    [html] view plain copy
     
    1. <html>  
    2.     <head>  
    3.         <title>不能访问此页面的历史页面</title>  
    4.     </head>  
    5.     <body>  
    6.         <p>测试一下效果,请等待一秒钟……</p>  
    7.         <p>然后点击浏览器的“后退按钮”,你会发现什么?</p>  
    8.         <script type="text/javascript">  
    9.             setTimeout(function(){    
    10.                 location.replace("http://www.sunchis.com");    
    11.             },1000);    
    12.         </script>  
    13.     </body>  
    14. </html>   

    location对象还有个reload()方法,可以重新载入当前页面。reload()方法有两种模式,即从浏览器的缓存中重载,或从服务器端重载。究竟采用哪种模式由该方法的参数决定。
    false:从缓存中重新载入页面;
    true:从服务器重新载入页面;
    无参数:从缓存中载入页面,如果参数省略,默认值为false。

    注意:
    在reload()方法执行后,再其后面的代码可能被执行,也可能不被执行,这由网络延迟和系统资源因素决定。因此,最好把reload()的调用放在代码的最后一行。
    文章的一开始就提到location是window对象和document对象的属性,因此,window.location和document.location是等价的,可以交互使用。

    location.origin兼容IE  (IE11+才有origin属性)

    [html] view plain copy
     
      1. if (window["context"] == undefined) {  
      2.     if (!window.location.origin) {  
      3.         window.location.origin = window.location.protocol + "//" + window.location.hostname +   
      4. (window.location.port ? ':' + window.location.port: '');  
      5.     }  
      6.     window["context"] = location.origin+"/V6.0";  
      7. }  
  • 相关阅读:
    数据持久化的基础知识
    svn常用命令
    关于SVN 目录结构
    linux查看CPU信息
    一个服务器上启动两台tomcat
    centos6.0 配置SVN
    mysql插入表情
    MAC 安装 PIL
    安装freetype
    Hadoop基本文件命令
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/8085059.html
Copyright © 2011-2022 走看看