认识Javascript中的Location对象(一)

浅浅的花香味﹌ 2022-08-26 12:18 211阅读 0赞

Location对象包含了当前页面与位置(url)相关的信息

URL示例：http://www.baidu.com:80/news/index.aspx?id=1&name=location\#top

Location对象共定义了8个属性：

href:声明了当前显示文档的完整的URL

protocol:声明URL的协议部分，包括后缀的冒号，例如http:

host:声明当前URL的主机名和端口号(是hostname和port的合集)，例如www.baidu.com:80

hostname:声明当前URL的主机名，例如www.baidu.com

port:声明当前URL的端口部分，例如80

pathname:声明当前URL的路径部分，例如news/index.aspx

search:声明当前URL的查询部分，例如?id=1&name=localhost

hash:声明当前URL的锚的部分，例如\#top，指定在文档中的锚记的名称

Location对象的这些属性都是可读可写的，如果改变了文档的location.href，则浏览器会载入新的页面。同样如果改变了location.hash，则页面会跳转到新的锚点，但此时页面不会重载。

想必大家会想，这个与link对象的url属性类似啊，不过link对象表示的是文档中的超链接，而Location对象表示的是浏览器当前显示文档的url。

当然，Location对象还有两个方法：reload()和replace()

reload():可以重新装载当前文档

replace():可以装载一个新文档而无须为它创建一个新的历史记录。也就是说，在浏览器的历史列表中，新文档将替换当前文档。这样就不能通过【返回】按钮返回当前文档了。

通过将url字符串信息赋值给窗口的location属性来装载新文档，可以实现返回浏览。

对那些使用了框架而且显示多个临时也的网站来说，replace()方法比较有用，这样临时页面都不被存储在历史列表中。

注意：

不要混淆Window对象的location属性和Document对象的location对象。前者引用一个Location对象，后者只是一个只读字符串，并不具有Location对象的任何特性。Document.location与document.URL是同义的。但是，当存在服务器重定向时，document.location包含的是已经装载的URL,而location.href包含的则是原始请求的文档的URL。

发表评论取消回复

表情：

评论列表（有 0 条评论，211人围观）

还没有评论，来说两句吧...

相关阅读

相关 Javascript location 对象详解

`location`对象是JavaScript中与当前页面地址栏信息相关的内置对象，它提供了当前页面URL的各种属性以及用于导航的方法。这对于在网页中实现页面跳转、获取或...

向右看齐/ 2024年05月28日 10:12/ 0 赞/ 106 阅读

相关简单认识JavaScript的BOM对象

简单认识JavaScript的BOM对象前面JavaScript中DOM的学习基本已经结束了。今天开始我们学习一下JavaScript中的BOM。 BOM(浏览

男娘i/ 2023年02月15日 10:16/ 0 赞/ 33 阅读

相关 javascript的location对象

对于Location这个JS内建的对象，似乎很多人都仅仅是应用href和search这两个属性。其实Location对象内建有多个属性和方法，都可以直接调用的。属性

你的名字/ 2022年08月27日 05:49/ 0 赞/ 211 阅读

相关认识Javascript中Location对象(二)以及如何获取URL中的查询字符串的值和获取网页的名称

给一个URL示例信息为参考： http://www.609.cn:80/news/index.aspx?id=1&name=location\top 一、需求是获

小鱼儿/ 2022年08月26日 12:18/ 0 赞/ 160 阅读

相关认识Javascript中的Location对象(一)

Location对象包含了当前页面与位置(url)相关的信息 URL示例：http://www.baidu.com:80/news/index.aspx?id=1&name=

浅浅的花香味﹌/ 2022年08月26日 12:18/ 0 赞/ 212 阅读

相关关于javascript中的location

<html> <head> <title>3-17</title> </head> <body>

àì夳堔傛蜴生んèń/ 2022年08月06日 08:20/ 0 赞/ 182 阅读

相关 DOM笔记（十一）：JavaScript对象的基本认识和创建

![Center][] 一、什么是对象？面向对象（Object-Oriented，OO）的语言有一个标志，那就是都有类的概念，例如C++、Java等；但是ECMAScri

﹏ヽ暗。殇╰゛Y/ 2022年08月06日 05:19/ 0 赞/ 202 阅读

相关 JavaScript window.location对象

经常使用window.location，它的结构总是记不住，简单梳理下，方便以后查询。示例 URL：http://b.a.com:88/index.php?name=

╰半夏微凉°/ 2022年01月06日 17:15/ 0 赞/ 315 阅读

相关 JavaScript中的location对象

location对象 location对象是window对象下的一个属性，有些的时候可以省略window对象。 location可以获取或者设置浏览器地址栏的URL。

左手的ㄟ右手/ 2021年10月23日 12:40/ 0 赞/ 402 阅读

相关 JS--JavaScript中的location对象概述和API详解

location对象概述 location对象存储当前页面与位置（URL）相关的信息，表示当前显示文档的Web地址。使用window对象的location属性可以访问。

男娘i/ 2021年08月13日 23:47/ 0 赞/ 540 阅读