`

JavaScript window.location对象

 
阅读更多


原文:
http://apps.hi.baidu.com/share/detail/54567640

location 地址对象 它描述的是某一个窗口对象所打开的地址。要表示当前窗口的地址,只需要使用“location”就行了;若要表示某一个窗口的地址,就使用“<窗口对象>.location”。

注意 属于不同协议或不同主机的两个地址之间不能互相引用对方的 location 对象,这是出于安全性的需要。例如,当前窗口打开的是“www.a.com”下面的某一页,另外一个窗口(对象名为:bWindow)打开的是“www.b.com”的网页。如果在当前窗口使用“bWindow.location”,就会出错:“没有权限”。这个错误是不能用错误处理程序(Event Handler,参阅 onerror 事件)来接收处理的。

示例

URL:http://b.a.com:88/index.php?name=kang&when=2011#first

protocol:

协议

"http:"

hostname:

服务器的名字

"b.a.com"

port:

端口

"88"

pathname:

URL中主机名后的部分

"/index.php"

search:

"?"后的部分,又称为查询字符串

"?name=kang&when=2011"

hash:

返回"#"之后的内容

"#first"

host:

等于hostname + port

"b.a.com:88"

href:

当前页面的完整URL

"http://www.a.com:88/index.php?name=kang&when=2011#first"

window.location和document.location互相等价的,可以交换使用

 

location的8个属性都是可读写的,但是只有href与hash的写才有意义。例如改变location.href会重新定位到一个URL,而修改location.hash会跳到当前页面中的anchor(<a id="name">或者<div id="id">等)名字的标记(如果有),而且页面不会被重新加载

 

注意

URL:http://b.a.com:88/index.php?name=kang&how=#when=2011#first

search:

"?name=kang&how="

第一个"?"之后

hash:

"#when=2011#first"

第一个"#"之后的内容

方法location.assign( url ) location.assign('http://www.baidu.com'); 等同于 window.location = 'http://www.baidu.com'

这种方式会讲新地址放到浏览器历史栈中,意味着转到新页面后“后退按钮”仍可以回到该页面。 location.replace( url ) 与assign方法一样,但会从浏览器历史栈中删除本页面,也就是说跳转到新页面后“后退按钮”不能回到该页面。目前IE、Chrome只是简单的跳转,只有Firefox会删除本页面的历史记录。 location.reload( force ) 重新载入当前页面。force为true时从服务器端重载;false则从浏览器缓存中重载,默认值false。

 

reload 方法,该方法强迫浏览器刷新当前页面。

语法: location.reload([bForceGet])

参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新")

replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过“前进”和“后退”来访问已经被替换的URL。

语法: location.replace(URL)

在 实际应用的时候,重新刷新页面的时候,我们通常使用: location.reload() 或者是 history.go(0) 来做。因为这种做法就像是客户端点F5刷新页面,所以页面的method="post"的时候,会出现“网页过期”的提示。那是因为Session的安全 保护机制。可以想到: 当调用 location.reload() 方法的时候, aspx页面此时在服务端内存里已经存在, 因此必定是 IsPostback 的。如果有这种应用: 我们需要重新加载该页面,也就是说我们期望页面能够在服务端重新被创建, 我们期望是 Not IsPostback 的。这里,location.replace() 就可以完成此任务。被replace的页面每次都在服务端重新生成。你可以这么写: location.replace(location.href)

 

下面是相关的应用与知识点:

window.location.href
window.top.location.replace("http://www.jb51.net")
top.location.href("http://www.jb51.net")
window.navigate ("http://www.jb51.net")
Html:
<meta http-equiv="Refresh" content="0; url=http://baidu.com/" >
---------------------------------------
URL即:统一资源定位符 (Uniform Resource Locator, URL)
完整的URL由这几个部分构成:
scheme://host:port/path?query#fragment
scheme:通信协议
常用的http,ftp,maito等

 

host:主机
服务器(计算机)域名系统 (DNS) 主机名或 IP 地址。

port:端口号
整数,可选,省略时使用方案的默认端口,如http的默认端口为80。

path:路径
由零或多个"/"符号隔开的字符串,一般用来表示主机上的一个目录或文件地址。

query:查询
可选,用于给动态网页(如使用CGI、ISAPI、PHP/JSP/ASP/ASP.NET等技术制作的网页)传递参数,可有多个参数,用"&"符号隔开,每个参数的名和值用"="符号隔开。
<!--[if !supportLineBreakNewLine]-->
<!--[endif]-->

fragment:信息片断
字符串,用于指定网络资源中的片断。例如一个网页中有多个名词解释,可使用fragment直接定位到某一名词解释。(也称为锚点.)
<!--[if !supportLineBreakNewLine]-->
<!--[endif]-->

对于这样一个URL

http://www.jb51.net:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere

我们可以用javascript获得其中的各个部分
1, window.location.href

整个URl字符串(在浏览器中就是完整的地址栏)

本例返回值: http://www.jb51.net:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere

2,window.location.protocol

URL 的协议部分

本例返回值:http:

3,window.location.host

URL 的主机部分

本例返回值:www.jb51.net

4,window.location.port

URL 的端口部分

如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符
本例返回值:""

5,window.location.pathname

URL 的路径部分(就是文件地址)

本例返回值:/fisker/post/0703/window.location.html

6,window.location.search

查询(参数)部分

除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值

本例返回值:?ver=1.0&id=6

7,window.location.hash

锚点

本例返回值:#imhere

 

分享到:
评论
1 楼 踏月流星 2012-02-28  
挺好的一篇文章。给个小小的建议:您别用灰色字体好吗,阅读起来挺不舒服的。

相关推荐

    window.location.href页面跳转的用法(区别于redirect)

    ### window.location.href页面跳转的用法(区别于redirect) #### 概述 在Web开发过程中,页面跳转是一项常见的需求。通常我们会使用`Response.Redirect`来进行页面跳转,但这种方式无法在跳转前执行客户端脚本...

    javascript 打开页面window.location和window.open的区别.docx

    - **刷新页面**:如果需要刷新当前页面,可以使用 `window.location.reload()` 方法。 - **跨域限制**:使用 `window.location` 或 `window.open` 时需要注意同源策略,确保不会违反跨域限制。 #### 七、总结 综上...

    深入解析:`window.location`对象在JavaScript中的运用

    在Web开发中,window.location对象是JavaScript中一个非常核心的部分,它提供了一种访问和修改当前文档URL的方法。这个对象包含了许多属性和方法,可以用来获取URL的各个组成部分,甚至可以用来导航到新的页面。本文...

    window.location.hash解析

    在JavaScript编程中,`window.location.hash` 是一个非常重要的属性,它用于获取或设置当前URL的哈希值,也就是URL中“#”后面的部分。这个属性在开发网页应用时经常被用来实现页面内的导航和锚点定位。这篇博客文章...

    详解js location.href和window.open的几种用法和区别.docx

    location.href 和 window.open 是 JavaScript 中两个常用的方法,用于控制浏览器的导航和窗口操作。它们的用法和区别是很多开发者需要了解和掌握的知识点。 一、location.href 的几种形式 location.href 属性返回...

    字符串 window.open() window.opener window.name window对象等的总结

    在JavaScript的世界里,`window`对象是全局对象,它提供了与浏览器窗口进行交互的各种方法和属性。本篇文章将深入探讨`window.open()`、`window.opener`、`window.name`以及`window`对象的一些核心概念,同时通过两...

    js 页面刷新location.reload和location.replace的区别小结.docx

    JavaScript 中的 location.reload 和 location.replace 方法的区别 在 JavaScript 中,我们经常使用 location.reload() 和 location.replace() 两个方法来刷新页面或重定向到新的 URL。但是,这两个方法之间有着...

    window.open.txt

    window.open("location.html", "_blank", "location"); ``` #### menubar `menubar`特性控制是否显示菜单栏。如果设置为`menubar=1`或省略,则显示菜单栏;如果设置为`menubar=0`,则隐藏菜单栏。示例代码如下: ``...

    JS 获取当前页面 URL.docx

    `window.location.href`返回一个字符串,该字符串包含完整的当前页面URL。这包括了协议(http或https)、主机名、端口号(如果有的话)、路径和查询字符串等所有部分。 ```javascript console.log(window.location....

    top.location.href和localtion.href有什么不同

    在Web开发中,`window.location`对象用于获取或设置当前浏览器窗口的位置信息,而`window.location.href`则用来获取或设置当前文档的URL。在涉及到网页中的框架(Frames)时,`top.location.href`与`location.href`...

    Window.Open详解

    此方法是 `window` 对象的一个属性,通过调用该方法可以指定打开的新窗口的URL、名称以及一系列窗口参数。 #### 二、基本语法 ```javascript window.open(pageURL, name, parameters); ``` - **pageURL**:必填...

    window.showModalDialog以及window.open用法简介

    Window.showModalDialog 和 Window.open 都是 JavaScript 中的方法,用于创建新窗口或对话框,下面分别介绍它们的用法和参数。 一、Window.open() 方法 Window.open() 方法用于打开一个新的浏览器窗口,可以指定新...

    window.open打开新窗口参数设置

    在前端开发中,`window.open()` 方法是浏览器内置的一个功能,用于在JavaScript中打开新的浏览器窗口。本文将深入探讨如何使用 `window.open()` 方法及其参数设置,帮助开发者更好地掌握此方法的用法。 #### 一、`...

    JavaScript中Window.open参数

    ### JavaScript中Window.open参数详解 #### 1. 最基本的弹出窗口代码 在Web开发中,`window.open` 方法是非常实用的一个功能,它可以用来创建一个新的浏览器窗口或标签页,并加载指定的URL。最简单的使用方式如下...

    js获取网址路径

    1. **`window.location.href`**:返回完整的URL(包括协议、主机名、端口、路径和查询字符串)。 - 示例代码: ```javascript console.log(window.location.href); // 输出如 ...

    关于struts2里用javascript刷新window.showModalDialog的父页面

    // 在这里添加判断逻辑,如果需要刷新父页面,则执行window.location.reload(); if (showModalUrl) { window.location.reload(); } } ``` 2. **分析`window.showModalDialog`的返回值**: - `window....

    JavaScript调用window函数.docx

    本文将详细介绍 JavaScript 中的 window 对象的各个属性和方法,包括 status、statusbar、defaultstatus、location、locationbar、self、name、closed、frames、frames.length、length、document、history、...

    javascript window对象

    ### JavaScript Window 对象详解 #### 一、简介 在JavaScript中,`Window`对象是所有浏览器窗口的基础。它是全局对象,也是顶级对象。对于初学者来说,了解`Window`对象的基本概念及其方法是非常重要的,这有助于...

Global site tag (gtag.js) - Google Analytics