`

javascript父子iframe和父子弹窗传值问题

 
阅读更多

Window 对象

Window 对象

Window 对象表示浏览器中打开的窗口。

如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。

注释:没有应用于 window 对象的公开标准,不过所有浏览器都支持该对象。

IE: Internet Explorer, F: Firefox, O: Opera.

Window 对象集合

集合 描述 IE F O
frames[]

返回窗口中所有命名的框架。

该集合是 Window 对象的数组,每个 Window 对象在窗口中含有一个框架或 <iframe>。属性 frames.length 存放数组 frames[] 中含有的元素个数。注意,frames[] 数组中引用的框架可能还包括框架,它们自己也具有 frames[] 数组。

4 1 9

Window 对象属性

属性 描述 IE F O
closed 返回窗口是否已被关闭。 4 1 9
defaultStatus 设置或返回窗口状态栏中的默认文本。 4 No 9
document 对 Document 对象的只读引用。请参阅 Document 对象 4 1 9
history 对 History 对象的只读引用。请参数 History 对象 4 1 9
innerheight 返回窗口的文档显示区的高度。 No No No
innerwidth 返回窗口的文档显示区的宽度。 No No No
length 设置或返回窗口中的框架数量。 4 1 9
location 用于窗口或框架的 Location 对象。请参阅 Location 对象 4 1 9
name 设置或返回窗口的名称。 4 1 9
Navigator 对 Navigator 对象的只读引用。请参数 Navigator 对象 4 1 9
opener 返回对创建此窗口的窗口的引用。 4 1 9
outerheight 返回窗口的外部高度。 No No No
outerwidth 返回窗口的外部宽度。 No No No
pageXOffset 设置或返回当前页面相对于窗口显示区左上角的 X 位置。 No No No
pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。 No No No
parent 返回父窗口。 4 1 9
Screen 对 Screen 对象的只读引用。请参数 Screen 对象 4 1 9
self 返回对当前窗口的引用。等价于 Window 属性。 4 1 9
status 设置窗口状态栏的文本。 4 No 9
top 返回最顶层的先辈窗口。 4 1 9
window window 属性等价于 self 属性,它包含了对窗口自身的引用。 4 1 9
  • screenLeft
  • screenTop
  • screenX
  • screenY
只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop,而 Firefox 和 Safari 支持 screenX 和 screenY。 4 1 9

Window 对象方法

方法 描述 IE F O
alert() 显示带有一段消息和一个确认按钮的警告框。 4 1 9
blur() 把键盘焦点从顶层窗口移开。 4 1 9
clearInterval() 取消由 setInterval() 设置的 timeout。 4 1 9
clearTimeout() 取消由 setTimeout() 方法设置的 timeout。 4 1 9
close() 关闭浏览器窗口。 4 1 9
confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框。 4 1 9
createPopup() 创建一个 pop-up 窗口。 4 No No
focus() 把键盘焦点给予一个窗口。 4 1 9
moveBy() 可相对窗口的当前坐标把它移动指定的像素。 4 1 9
moveTo() 把窗口的左上角移动到一个指定的坐标。 4 1 9
open() 打开一个新的浏览器窗口或查找一个已命名的窗口。 4 1 9
print() 打印当前窗口的内容。 5 1 9
prompt() 显示可提示用户输入的对话框。 4 1 9
resizeBy() 按照指定的像素调整窗口的大小。 4 1 9
resizeTo() 把窗口的大小调整到指定的宽度和高度。 4 1.5 9
scrollBy() 按照指定的像素值来滚动内容。 4 1 9
scrollTo() 把内容滚动到指定的坐标。 4 1 9
setInterval() 按照指定的周期(以毫秒计)来调用函数或计算表达式。 4 1 9
setTimeout() 在指定的毫秒数后调用函数或计算表达式。 4 1 9

Window 对象描述

Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中,Window 对象是全局对象,所有的表达式都在当前的环境中计算。也就是说,要引用当前窗口根本不需要特殊的语法,可以把那个窗口的属性作为全局变量来使用。例如,可以只写 document,而不必写 window.document。

同样,可以把当前窗口对象的方法当作函数来使用,如只写 alert(),而不必写 Window.alert()。

除了上面列出的属性和方法,Window 对象还实现了核心 JavaScript 所定义的所有全局属性和方法。

Window 对象的 window 属性和 self 属性引用的都是它自己。当你想明确地引用当前窗口,而不仅仅是隐式地引用它时,可以使用这两个属性。除了这两个属性之外,parent 属性、top 属性以及 frame[] 数组都引用了与当前 Window 对象相关的其他 Window 对象。

要引用窗口中的一个框架,可以使用如下语法:

frame[i]		//当前窗口的框架
self.frame[i]	//当前窗口的框架
w.frame[i]	//窗口 w 的框架

要引用一个框架的父窗口(或父框架),可以使用下面的语法:

parent		//当前窗口的父窗口
self.parent	//当前窗口的父窗口
w.parent 		//窗口 w 的父窗口

要从顶层窗口含有的任何一个框架中引用它,可以使用如下语法:

top		//当前框架的顶层窗口
self.top		//当前框架的顶层窗口
f.top		//框架 f 的顶层窗口

新的顶层浏览器窗口由方法 Window.open() 创建。当调用该方法时,应把 open() 调用的返回值存储在一个变量中,然后使用那个变量来引用新窗口。新窗口的 opener 属性反过来引用了打开它的那个窗口。

一般来说,Window 对象的方法都是对浏览器窗口或框架进行某种操作。而 alert() 方法confirm() 方法prompt 方法则不同,它们通过简单的对话框与用户进行交互。

分享到:
评论

相关推荐

    详解layui弹窗父子窗口之间传参数的方法

    但是,在layui 弹窗父子窗口之间传参数是一个常见的问题。本文将详细介绍 layui 弹窗父子窗口之间传参数的方法。 首先,让我们了解一下 layui 弹窗的基本使用方法。layui 提供了 layer.open() 方法来打开一个新的...

    iframe父子传值

    总结,`iframe`的父子窗口间通信主要依赖于`window.postMessage`、URL查询参数、`localStorage`、`sessionStorage`和`window.name`等方法。在实际应用中,应根据安全性和兼容性的需求选择合适的方式。同时,理解和...

    window.open父子窗口传值问题

    当我们谈论“window.open父子窗口传值问题”,我们指的是在父窗口通过`window.open`创建了一个子窗口,并需要在两者之间进行数据通信的情况。 首先,让我们了解一下`window.open`的基本语法: ```javascript var ...

    layer弹出子iframe层父子页面传值的实现方法

    总结来说,Layer弹出子iframe层父子页面传值实现方法需要借助于JavaScript的Window对象的contentWindow属性来访问子iframe的DOM和方法。父页面通过特定的代码片段实现与子页面元素的选择和交互,以及方法的调用。在...

    iframe与父页面传值

    总结来说,`iframe`与父页面传值涉及的技术包括`postMessage`、`window.name`、查询字符串、hash等,并且需要注意跨域安全和同源策略的限制。这些技术在实际开发中被广泛应用于实现各种复杂功能,如组件化开发、页面...

    javascript父子页面传参

    总的来说,JavaScript父子页面传参涉及多种技术,根据实际场景选择合适的方法。理解并熟练掌握这些技术对于开发交互丰富的Web应用至关重要。在实际项目中,还应注意安全性问题,避免跨站脚本攻击(XSS)等风险。

    JavaScript实现IFrame子窗口调用父窗口的全局变量

    JavaScript实现IFrame子窗口调用父窗口的全局变量

    使用js通过iframe给父窗体传值以及取值

    通过js实现的子窗体与父窗体之间的值传递

    ie 模态弹窗 父子窗口交换数据

    5. **使用IFrame**:如果子窗口是一个嵌入在父窗口中的IFrame,那么可以直接通过JavaScript访问IFrame的`contentWindow`属性,从而实现双向通信。 在处理IE浏览器时,需要注意以下几点兼容性问题: - IE8及更早...

    js操作模态窗口及父子窗口间相互传值示例

    如果需要在这些浏览器中实现类似功能,可能需要使用其他技术如iframe或者第三方JavaScript库来模拟模态窗口效果。 对于现代Web应用开发来说,了解并掌握父子窗口间的数据传递技术,对提升用户体验以及满足特定的...

    Layui实现父子页面之间值传递.zip

    `Layui` 提供了一个基于 `JavaScript` 的模块化机制,通过 `layui.use()` 方法加载需要的模块,如 `layui.table` 和 `layui.layer`。`layui.table` 用于展示数据表格,而 `layui.layer` 则用于弹出层,可以用来创建...

    iframe父页面与子页面通信及相互调用方法

    "iframe父页面与子页面通信及相互调用方法"是一个重要的主题,涉及到跨域安全、DOM操作以及JavaScript/jQuery的交互技术。下面将详细解释这一知识点。 1. **基本概念** - **父页面(Parent Page)**:包含`iframe`...

    JS简单实现父子窗口传值功能示例【未使用iframe框架】

    在本示例中,我们将探讨如何在不使用iframe框架的情况下,利用JavaScript实现父子窗口之间的简单传值。 首先,我们有一个父窗口页面`father.html`,其中包含一个按钮,当点击该按钮时,会打开一个子窗口`child....

    javascript父子页面通讯实例详解

    下面我们将详细探讨如何实现JavaScript父子页面之间的通信以及相关原理。 首先,父子页面之间的通信受到同源策略的限制,这意味着只有当两个页面具有相同的域名、协议和端口时,它们才能互相访问。但在某些情况下,...

    Jquery调用iframe父页面中的元素及方法

    不过,当iframe和父页面属于同一域时,可以通过JavaScript或jQuery来操作父页面中的元素和方法。本文将详细介绍如何使用jQuery来查找和操作iframe父页面中的元素和方法。 首先,需要明确iframe元素可以被视为一个...

    HTML父子页面

    在网页开发中,HTML父子页面的概念是至关重要的,它涉及到页面间的交互和数据共享。HTML(HyperText Markup Language)是构建网页的基础语言,通过合理的标签结构来组织网页内容。在这个场景下,"父子页面"通常指的...

    父子页面数据相互传递

    本示例聚焦于“父子页面数据相互传递”,旨在提供一种有效的方法来解决这一问题。 首先,我们来看一下父子页面的基本概念。在Web环境中,父页面通常指的是包含其他页面的页面,比如一个框架集或者一个弹出窗口。子...

    在iframe 中页面中设置遮罩遮罩层

    此外,由于涉及到跨域问题,如果`iframe`加载的页面不在同一域名下,可能会受到浏览器同源策略的限制,无法直接操作iframe内容。这时,可以考虑使用`postMessage`和`message`事件进行父子窗口间的通信,控制遮罩层的...

    js操作iframe父子窗体示例

    总结以上内容,通过JavaScript操作iframe父子窗体可以实现父窗口和子窗口间的数据访问和方法调用。这种方式常用于网页中嵌入第三方页面时,父页面需要与嵌入的页面进行交互的场景。在进行操作时,需要注意同源策略的...

Global site tag (gtag.js) - Google Analytics