一、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对象)的更多相关文章

  1. 第8章 浏览器对象模型BOM 8.2 location对象

    location 是最有用的 BOM对象之一,它提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能.事实上, location 对象是很特别的一个对象,因为它既是 window 对象的属性, ...

  2. BOM元素之location对象

    location对象提供了与当前窗口中加载的文档有关的信息,还提供了一些导航功能,它既是window对象的属性,也是document对象的属性:换句话说,window.location和documen ...

  3. JavaScript -- 时光流逝(十):Screen 对象、History 对象、Location 对象

    JavaScript -- 知识点回顾篇(十):Screen 对象.History 对象.Location 对象 1. Screen 对象 1.1 Screen 对象的属性 (1) availHeig ...

  4. 8.5 JavaScript的BOM(二)

    8.5 JavaScript的BOM 即 浏览器对象模型(Browser Object Model) 浏览器对象包括 一.Window(窗口) 如果需要打开一个新的网站,应该通过超级链接等方式让用户主 ...

  5. 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具

    查看本章节 查看作业目录 需求说明: 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具 实现思路: 使用history对象中的 forward() 方法和 ...

  6. JavaScript 基础(三) - Date对象,RegExp对象,Math对象,Window 对象,History 对象,Location 对象,DOM 节点

    Date对象 创建Date对象 //方法1:不指定参数 var date_obj = new Date(); alert(date_obj.toLocaleString()) //方法2:参数为日期字 ...

  7. BOM 3.1 location对象 | history对象 | navigator对象 | 定时器 | 三大系列

    JavaScript分三个部分: 1. ECMAScript标准---基本语法 2. DOM--->Document Object Model 文档对象模型,操作页面元素的 3. BOM---& ...

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

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

  9. History对象和location对象

    history对象 History对象包含用户在浏览器窗口中访问过的url.不是所有浏览器都支持该对象. 属性length   返回浏览器历史列表中的URL数量. 方法:back() 加载histor ...

随机推荐

  1. Autofac注册组件详解

    注册概念:我们通过创建 ContainerBuilder 来注册 组件 并且告诉容器哪些 组件 暴露了哪些 服务.组件 可以通过 反射 创建; 通过提供现成的 实例创建; 或者通过 lambda 表达 ...

  2. SPOJ - Triple Sums

    [传送门] FFT第一题! 构造多项式 $A(x) = \sum x ^ {s_i}$. 不考虑题目中 $i < j < k$ 的条件,那么 $A^3(x)$ 每一项对应的系数就是答案了. ...

  3. 2019SDN上机第2次作业

    1. 利用mininet创建如下拓扑,要求拓扑支持OpenFlow 1.3协议,主机名.交换机名以及端口对应正确,请给出拓扑Mininet执行结果,展示端口连接情况 创建拓扑: 拓扑支持OpenFlo ...

  4. Linux性能优化实战学习笔记:第三十二讲

    一.上节总结 专栏更新至今,四大基础模块的第三个模块——文件系统和磁盘 I/O 篇,我们就已经学完了.很开心你还没有掉队,仍然在积极学习思考和实践操作,并且热情地留言与讨论. 今天是性能优化的第四期. ...

  5. Linux性能优化实战学习笔记:第四十五讲

    一.上节回顾 专栏更新至今,四大基础模块的最后一个模块——网络篇,我们就已经学完了.很开心你还没有掉队,仍然在积极学习思考和实践操作,热情地留言和互动.还有不少同学分享了在实际生产环境中,碰到各种性能 ...

  6. [LeetCode] 212. Word Search II 词语搜索之二

    Given a 2D board and a list of words from the dictionary, find all words in the board. Each word mus ...

  7. java ++前缀

    public class Sample { public static void main(String[] args) { , num2 = ; , num4 = ; ++num1; System. ...

  8. kali linux2019.4 设置中文字体教程

    最近Kali linux更新到了2019.4版本,下载下来发现找不到设置中文的选项,经过在网上搜索一番发现一个开源的汉语字体包:文泉驿字体 在终端中输入以下命令 apt-get install ttf ...

  9. chrome浏览器如何查看、修改、删除Cookie

      1.chrome浏览器的cookie保存位置 C:\Users\你的用户名\AppData\Local\Google\Chrome\User Data\Default 快捷键win+r--> ...

  10. Windows下MySQL安装流程,8.0以上版本ROOT密码报错及修改

    官网下载MySQL安装后,解压,添加环境变量,以管理员方式运行cmd,运行以下命令 mysqld --initialize --console mysqld -install net start my ...