`

document.location.href和replace区别 (转载)

 
阅读更多

document.location.href和replace区别
document.location.href和document.location.replace都可以实现从A页面切换到B页面,但他们的区别是:

用 document.location.href切换后,可以退回到原页面。

而用document.location.replace切换后,不可以通过“后退”退回到原页面。

关于document.location.href或其他可回退的切换方式,我还发现一个细节,

用个例子来说明:

假设有A.htm B.htm C.htm三个页面

A.htm里有这样一句:document.location.href="b.htm";

b.htm里有这样一句:document.location.href="c.htm";

注意两个都是可回退的切换。


1:当从A切换到B再切换到C时,实际内存中保留了三个页面:A、B、C

2:回退到B时,C页面被清出内存!

3:再次回退,到A页面时,B页面也被清出内存!

4:再次向前(不是用切换而是用向前)转到B页面时,

内存中保留的是A和B

>>> 当一个文档被location.replace()替换后,它就会从当前的历史对象中移除了


location.href 解析

top.location.href="/url"
说的是在顶层页面打开url
self.location.href="/url"
说的是仅本页面打开url地址
parent.location.href="/url"
说的是你窗口打开Url地址

应该还有一个this.location.href="/url"
用法和self的用法一致

还有就是如果页面当中有自定义的frame 的话,
也可以将parent  self   top换为自定义frame的名称
效果就是在自定义frame窗口打开url地址

if(window != top){
   top.location.href="/login.aspx";
}

 

<script>
function switchSysBar(){ 
  //取得当前url地址,将main_middel.html 去掉 
 var locate=location.href.replace('main_middel.html','');
 //将所有name = img1的图片地址中去掉刚才上面得到的路径,只留下类似 images/*.gif的字符串
 var ssrc=document.all("img1").src.replace(locate,'');
 //如果图片是images/list_button.gif ,则将它换成images/list_button_r.gif,并隐藏frmTitle 
 if (ssrc=="images/list_button.gif")
 {
 document.all("img1").src="images/list_button_r.gif";
 document.all("frmTitle").style.display="none" 
 } 
 //否则,将图片替换为images/list_button.gif ,并显示frmTitle 
 else
 { 
 document.all("img1").src="images/list_button.gif";
 document.all("frmTitle").style.display="" 
 } 
 }
</script>

 

 

分享到:
评论

相关推荐

    [removed].href和.replace的区别示例介绍

    在网页开发中,导航是用户体验的关键部分,而`document.location.href`和`document.location.replace`则是JavaScript中控制页面导航的两个重要方法。虽然它们都能实现页面间的跳转,但它们在处理历史记录方面有着...

    JAVASCRIPT-DOCUMENT方法大全.pdf

    12. `document.location.replace(URL)`: 打开新URL,替换当前页面,且不记录在历史记录中。 **selection子对象和images集合** `document.selection`是用于处理用户选择的文本,但在现代浏览器中已被`window....

    javascript 的Document属性和方法集合

    - `document.location.reload()`, `document.location.reload(URL)`, `document.location.assign(URL)`, `document.location.replace(URL)`: 分别用于刷新页面、加载新页面和替换当前页面。 5. **selection对象** ...

    js location.replace与location.reload的区别

    在处理页面导航和刷新时,通常会使用location.replace()和location.reload()这两个方法。这两个方法虽有相似之处,但在实际应用中却有着本质的区别。接下来我们将详细探讨这两者的区别,以及它们的适用场景和操作...

    document对象总结

    - **document.location.replace(URL)**: 替换当前历史记录项,跳转到指定的URL地址。 #### Selection对象 `document.selection`提供了操作用户在页面中选定文本的方法,但其可用性取决于浏览器类型和版本。 #### ...

    脚本中Document对象内容集合介绍

    - `document.location.replace(URL)`: 加载新的URL并替换当前历史记录条目。 ### 5. `selection`子对象 - `document.selection`: 用于处理用户的文本选择。在旧版本的IE浏览器中使用,但在现代浏览器中已被`window...

    JavaScript的document方法汇总

    - `document.location.replace(URL)`:加载指定URL指向的页面并替换当前页面的历史记录条目。 #### 四、图片处理 1. **获取图片信息**: - `document.images`:获取页面上所有的`&lt;img&gt;`元素。 - `document....

    javascript的document对象

    - **document.location.replace(URL)**:替换历史记录中的当前条目,并加载新的URL地址。 #### Selection对象 - **document.selection**:用于获取用户在文档中选中的文本范围。此对象主要应用于IE浏览器,其他...

    Document对象内容集合

    - **`document.location.replace(URL)`**:用指定URL替换当前文档。 #### 五、Selection对象 **5.1 `document.selection`** - **作用**:获取用户在文档中选定的内容。 #### 六、Images对象 **6.1 操作图像** - ...

    JS页面跳转和js对iframe进行页面跳转、刷新

    与`window.location.href`类似,但不同之处在于`replace`不会在浏览器的历史记录中留下跳转记录,这意味着用户点击后退按钮时不会回到之前的页面。 ```javascript window.location.replace("http://www.example.com"...

    js刷新页面location.reload()用法详解

    与`location.replace()`的区别 `location.replace()`函数会替换当前的历史记录条目,而`reload()`则会重新添加一个历史记录条目。这意味着,当你使用`replace()`后,用户无法通过点击浏览器的“后退”按钮返回到被...

    javascript 页面刷新和模态对话框 学习总结 推荐哦

    location.replace(window.location.href); // 刷新当前页面 location.replace("http://www.example.com"); // 跳转到新的URL ``` ##### 11. 使用`history.go(0)` - **语法**: `history.go(0);` - **功能**: ...

    js刷新页面方法大全

    总结来说,JavaScript提供了多种方式来刷新页面,包括`location.reload()`、`window.location.href`、`history.go(0)`、过时的`document.execCommand('refresh')`以及利用`meta`标签。开发者应根据具体需求选择合适...

    js 返回上一页和刷新

    7. 使用document对象:document.URL=location.href可以刷新当前页面。 示例代码:&lt;script language="javascript"&gt;location.reload(); 三、自动刷新页面 1. 使用meta标签:可以每隔20秒刷新一次页面。 2. 使用...

    JavaScriptdocument对象方法属性大全

    - `document.location.assign()`、`replace()`:分别用于加载新页面或替换当前页面历史记录。 14. **图像操作** - `document.images`:返回一个包含文档中所有`&lt;img&gt;`元素的数组。 - 通过`name`属性或数组索引...

    javascript页面跳转常用代码宣贯.pdf

    8. `document.URL=location.href`:该方法可以刷新当前页面,重新加载页面的所有内容。 自动刷新页面 除了手动刷新页面外,Javascript 还可以实现自动刷新页面,以下是一些常用的方法: 1. `...

    javascript页面跳转常用代码.pdf

    7. `document.URL=location.href`:类似于`location=location`,通过改变URL来刷新页面。 接下来是自动刷新页面的方法: 1. 使用HTML的`&lt;meta&gt;`标签:`&lt;meta http-equiv="refresh" content="20"&gt;`会让页面每20秒...

Global site tag (gtag.js) - Google Analytics