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，改变该属性，就可以跳转到新的页面：

  1. <script type="text/javascript">
  2. location.href = "http://www.sunchis.com";    
  3. </script>

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

  1. <script type="text/javascript">
  2. location.assign("http://www.sunchis.com");
  3. </script>

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

  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属性）

    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. }

js的location对象的更多相关文章

  1. 5月15日上课笔记-js中 location对象的属性、document对象、js内置对象、Date事件对象、

    location的属性: host: 返回当前主机名和端口号 定时函数: setTimeout( ) setInterval() 二.document对象 getElementById(); 根据ID ...

  2. js 的Location对象

    Location对象 location用于获取或设置窗体的URL,并且可以用于解析URL. 语法: location.[属性|方法] location对象属性图示: location 对象属性: ha ...

  3. Js之Location对象

    Window对象的location属性引用的是Location对象,它表示该窗口中当前显示的文档的URL,并定义了方法来使窗口载入新的文档.Document对象的location属性也引用到Locat ...

  4. JS浏览器对象：window对象、History、Location对象、Screen对象

    一.JS浏览器对象-window 1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成 ...

  5. 【2017-03-28】JS基础、windows对象、history对象、location对象

    一.JS基础 JS - javaScript 1.js功能: 1).进行数据的运算.2).控制浏览器的一些功能.3).控制元素(属性.内容.样式) js引用位置: 可以放在html页的任意位置. 推荐 ...

  6. js location对象

    location提供了与当前窗口中加载文档有关的信息.还提供了一些导航功能.它既是window对象的属性,又是document对象的属性,window.location与document.locati ...

  7. JS BOM对象 History对象 Location对象

    一.BOM对象 BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作 window对象 所有浏览器都支持 window 对象. 概念上讲.一个html文档对应一个window对象. 功能上讲: 控 ...

  8. js location对象相关命令

    Location.href 返回整个当前url,若对其赋值:location.href="http://www.sina.com.cn"则跳转其urllocation.host 返 ...

  9. JS window对象 Location对象 location用于获取或设置窗体的URL，并且可以用于解析URL。 语法: location.[属性|方法]

    Location对象 location用于获取或设置窗体的URL,并且可以用于解析URL. 语法: location.[属性|方法] location对象属性图示: location 对象属性: lo ...

随机推荐

  1. CSS选择器定位的使用

    CSS 可以比较灵活选择控件的任意属性,一般情况下定位速度要比XPath 快,但对于初学者来说比较难以学习使用,下面我们就详细的介绍CSS 的语法与使用.一.CSS 选择器的常见语法: 例如下面一段代 ...

  2. java数据结构简单点

    java常用的数据结构一 集合框架主要就是Collection和Map: 1.Collection包含了List和Set两大分支. (1)List是一个有序的集合,每一个元素都有它的索引.第一个元素的 ...

  3. Flask--修改默认的static文件夹的方法

    修改的flask默认的static文件夹只需要在创建Flask实例的时候,把static_folder和static_url_path参数设置为空字符串即可. app = Flask(__name__ ...

  4. 【Ts 1】 maven初识

    PS:本篇博客,就是对于maven的一个简单的总结,认识.可能更多的是借鉴别人的看法,然后结合自己的使用,再加以说明. 首先,什么是maven: Apache Maven is a software ...

  5. COJ 1211 大整数开平方

    手写求大整数开根号所得到的值,具体计算过程参考别人的资料,最后利用java的大整数得到答案 别人博客链接:http://www.cnblogs.com/Rinyo/archive/2012/12/16 ...

  6. BZOJ 2561: 最小生成树【最小割/最大流】

    Description 给定一个边带正权的连通无向图G=(V,E),其中N=|V|,M=|E|,N个点从1到N依次编号,给定三个正整数u,v,和L (u≠v),假设现在加入一条边权为L的边(u,v), ...

  7. 【HDOJ6318】Swaps and Inversions（树状数组）

    题意: 给定一串数组,其中含有一个逆序对则需要花费x,交换相邻两个数需要花费y,输出最小花费. n<=1e5,-1e9<=a[i]<=1e9 思路: #include<cstd ...

  8. vs2010 静态使用 opencv 2.46 库

    下载opencv2.46的库,假设解压到OpenCV246,设置如下: 在工程的c++的include目录下添加:OpenCV246\opencv\build\include 在工程的c++的lib目 ...

  9. 进入一个jsp直接跳到另一个jsp

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  10. POJ 3281 [网络流dinic算法模板]

    题意: 农场主有f种食物,d种饮料,n头牛. 接下来的n行每行第一个数代表第i头牛喜欢吃的食物数量,和第i头牛喜欢喝的饮料数目. 接下来分别是喜欢的食物和饮料的编号. 求解:农场主最多能保证几头牛同时 ...