top,self,parent,open,href,location 详细解释
关于这几个常用的脚本关键字，很多人经常会很不明白，现在我采用下面的方式相信能很快明白：(如果A,B,C,D,Page都是htm，D是C的iframe，C是B的iframe，B是A的iframe，Page是公共呈现页面。如果D中js这样写)
大致页面的源码如下：
D.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
/*注释部分与非注释部分等价*/
/*iframe嵌套关系是A->B->C->D*/
function fun1() {
window.open("Page.htm", "_blank");
// = window.open("");
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<h1 style="color: Purple; font-size: xx-large; font-weight: bolder;">
你进入了Page.htm</h1>
</body>
</html>
}
function fun2() {
location.href = "Page.htm";
//= window.location.href = self.location.href = "Page.htm"; //在D页面实现展现
//=window.open("Page.htm", "_self"); //在D页面实现展现
}
function fun3() {
parent.location.href = "Page.htm"
// = window.parent.location.href = "Url地址"; //在C页面实现展现
//=window.open("Page.htm", "_parent"); //在C页面实现展现
}
function fun4() {
top.location.href = "Page.htm"
// = window.top.location.href = "Page.htm"; //在A页面实现展现
// =window.open("Page.htm", "_top")//在A页面实现展现
}
function fun5() {
parent.parent.location = "Page.htm"; //在B页面实现展现
//=parent.open("Page.htm", "_parent") = parent.parent.open("Page.htm", "_self") //在B页面实现展现
}
</script>
</head>
<body>
<h1 style="color: Red;">
D</h1>
<input type="button" id="btn1" value="window.open" onclick="fun1()" /><br />
<input type="button" id="btn2" value="location.href" onclick="fun2()" /><br />
<input type="button" id="btn3" value="parent.location.href" onclick="fun3()" /><br />
<input type="button" id="btn4" value="top.location.href" onclick="fun4()" /><br />
<input type="button" id="btn5" value="parent.parent.location" onclick="fun5()" /><br />
</body>
</html>
C.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<h1 style="color: Yellow;">
C</h1>
<iframe src="D.htm" style="width: 600px; height: 800px"></iframe>
</body>
</html>
Page.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<h1 style="color: Purple; font-size: xx-large; font-weight: bolder;">
你进入了Page.htm</h1>
</body>
</html>
A.htm 效果如下：
从上至下一次点击五个按钮效果如下：
1.
2.
3.
4.
5.
本文转自网上：
http://apps.hi.baidu.com/share/detail/18034464
分享到：
相关推荐
在实际应用中，location.href 和 window.open() 都可以用来实现页面的跳转和弹出窗口，但是它们的用法和区别需要根据具体情况选择。例如，在某些情况下，需要在当前页面跳转到新的 URL，可以使用 location.href。 而...
也可以指定为 "_self"、"_parent" 或 "_top" 等。 - **features**：窗口的属性字符串，例如大小、位置、滚动条等。 ##### 2. `window.showModalDialog()` 方法 `window.showModalDialog()` 可以创建模态对话框，...
用iframe、弹出子页面刷新父页面 iframe parent.location.reload(); 弹出子页面 window.opener.location.reload(); 子窗口刷新父窗口 self.window.opener.locaction.reload(); 刷新一open（）方法打开的窗口 ...
### 弹出窗口全解析：深入理解`window.open`与相关技术 在现代网页开发中，弹出窗口是一个常见的功能需求，它不仅用于显示额外的信息，还常被用于登录、注册、广告展示等场景。本文将全面解析弹出窗口的实现机制，...
2. **弹窗阻止**：许多浏览器都具有弹出窗口阻止功能，这可能会影响 `window.open()` 方法的执行结果。 3. **安全限制**：出于安全考虑，跨域访问可能会受到限制。 4. **用户体验**：频繁使用 `window.open()` 可能...
### JavaScript 弹出窗口命令总结 #### 一、概述 在网页开发中，JavaScript 提供了多种用于创建弹出窗口的方法。这些方法可以帮助开发者在不离开当前页面的情况下展示额外的信息或进行用户交互。本文将详细介绍 `...
- `name`：窗口的名称，可以是预定义的（如`_self`，`_blank`，`_parent`，`_top`）或自定义的。 - `features`：包含窗口属性的字符串，如宽度、高度、是否显示工具栏、菜单栏等。 以上就是JavaScript弹出窗口的...
在Web开发中，经常会出现需要从子窗口或弹出窗口刷新父窗口的情况。这通常发生在使用JavaScript进行页面交互时。本文将详细介绍四种不同的方法来实现这一目标。 #### 1. 弹出子页面刷新父窗口 在打开一个新的窗口...
2. **安全性**: 许多浏览器都增加了对弹出窗口的限制，以防止恶意弹出窗口干扰用户的浏览体验。因此，在某些情况下，`window.open()` 可能会被阻止。 3. **用户体验**: 频繁地使用 `window.open()` 打开新窗口可能会...
### window.open 不被拦截弹出窗简述 在Web开发中，`window.open()`方法用于创建一个新的浏览器窗口或标签页，并返回对新打开窗口的引用。这个方法在很多场景下非常有用，比如用来实现弹出窗口、跳转链接等功能。...
此方法对于实现弹出窗口、预览功能等具有重要作用。下面将详细探讨 `window.open` 方法的各项参数及其应用场景。 #### 基本语法 ```javascript window.open(URL, target, features); ``` - **URL**: 指定新窗口加载...
可以是预定义的值如`'_self'`, `'_blank'`, `'_parent'`, `'_top'`等，或者自定义名称。 3. **parameters**：一系列用逗号分隔的选项，用于设置新窗口的特征，如尺寸、菜单栏、工具栏等。 例如，要打开一个宽400...
例如，`window.parent.location.href=window.parent.location.href`或`window.parent.location.reload()`可以刷新父窗口。 除了上述基本操作，还有其他一些高级交互方式： 1. **子窗口关闭父窗口**： 子窗口可以...
与修改`window.location.href`类似，`self.location`同样可以实现当前窗口的页面跳转。 #### 6. 使用`top.location` ```javascript top.location = '目标URL'; ``` 若页面处于多层嵌套的框架结构中，使用`top....
因此，当`iframe`内的脚本使用`window.open()`、`window.location.href`等方法时，可能会导致父窗口被覆盖或重定向。 要禁止`iframe`中的脚本影响父窗口，我们可以采取以下几种策略： 1. **阻止脚本执行**：在父...
为了解决这个问题，开发者通过将`target`属性设置为`_top`，强制链接在顶层窗口打开，从而使得点击后的页面跳转能够替代整个浏览器窗口的内容，而不是仅在弹出层内进行。 ### 知识点4：AJAX技术的运用 在描述中，...
JSP 中的 Window 对象是指浏览器窗口，它提供了多种操作，包括获取当前窗口的信息、控制窗口的样式、打开新的窗口、弹出对话框等。下面是 JSP 中的 Window 属性的详解： 1. frames 属性：表示当前窗口中所有 frame ...
* top：包含当前框架的最顶层浏览器窗口的同义词 * window：当前窗口或框架的同义词 window 对象的方法包括： * alert：打开一个 Alert 消息框 * clearTimeout：终止 setTimeout 方法的工作 * close：关闭窗口 * ...
- `createPopup()`：创建一个弹出窗口。 - `focus()`：将键盘焦点给予一个窗口。 - `getSelection()`：返回一个Selection对象，表示文档中被选中的文本。 #### 二、案例 下面是一些使用Window对象的示例代码： ...