涉及到的内容有(主要研究相关长度和位置的计算方法):
·screen
·window
·navigator
·document、body
·frameset、frame
·iframe
·模态对话框、非模态对话框
--------------------------------------------------------
·screen
availHeight 返回显示屏幕的高度 (除 Windows 任务栏之外)
availWidth 返回显示屏幕的宽度 (除 Windows 任务栏之外)
height 屏幕的高度
width 屏幕的宽度
--------------------------------------------------------
·window
-窗口在屏幕上的坐标(screenLeft、screenTop、screenX、screenY )
在ie各个版本中,用到的是screenLeft和screenTop,而且它所指的窗口是显示区域而不是整个浏览器
opera与ie相同,如果使用screenX和screenY结果都为0
firefox使用的是screenX和screenY,它是整个浏览器的坐标
在chrome两种方式同可以,结果也相同,它也是是整个浏览器的坐标
统一之后,即ie和opera显示的是页面左上角相对于屏幕的坐标,而chrome和firefox是浏览器相对于屏幕的坐标
-open函数
window.open("test.htm","windowName","parameters");
参数介绍:
depended | yes/no | 是否和父窗口同时关闭
directories | yes/no | Nav2和3的目录栏是否可见
location | yes/no | 位置栏是否可见
menubar | yes/no | 菜单栏是否可见
scrollbars | yes/no | 窗口是否可有滚动栏
titlebar | yes/no | 窗口题目栏是否可见
toolbar | yes/no | 窗口工具栏是否可见
resizable | yes/no | 窗口大小是否可调整
hotkeys | yes/no | 在没菜单栏的窗口中设安全退出热键
height | pixel value | 窗口高度
Width | pixel value | 窗口的像素宽度
innerHeight | pixel value | 窗口中文档的像素高度
innerWidth | pixel value | 窗口中文档的像素宽度
outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度
outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度
left | pixel value | 窗口距屏幕左边界的像素长度
top | pixel value | 窗口距屏幕上边界的像素长度
z-look | yes/no | 窗口被激活后是否浮在其它窗口之上
alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后
alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上
left和top主要都是相对于screen的原点
height和width主要是内容部分的长度和高度
--------------------------------------------------------
·navigator(见"客户端信息.htm"页面)
--------------------------------------------------------
·document
documentElement.clientWidth,documentElement.clientHeight
·body
clientWidth,clientHeight
scrollWidth,scrollHeight
offsetWidth,offsetHeight
--------------------------------------------------------
·frameset-frame
·iframe
首先,在包含页面使用获取到的frame或者iframe元素与包含页面中的window对象有什么区别
用处:可以在父页中调用子页面的函数
解决方法:可以获取到对应的frame元素后,使用其contentWindow属性得到内容页面的window对象
如:document.getElementById('iframedemo').contentWindow.demofunction(); (chrome貌似支持不太好)
分享到:
相关推荐
以下是关于window对象及其相关方法的知识点总结: 1. Window对象的创建和关闭方法 - window.open():此方法用于打开一个新窗口。它可以接受多个参数,包括URL地址、窗口名称、特性列表等。例如:window.open("***",...
标题中的“64位-java-Window电脑系统.zip”暗示了这个压缩包是为64位Windows操作系统设计的Java开发环境。这通常包括Java Development Kit (JDK) 和一个集成开发环境(IDE),如Eclipse。在提供的文件列表中,我们...
总结:Window对象在DOM编程中扮演着至关重要的角色,它提供了与用户交互、控制页面加载和导航以及创建新窗口的能力。通过理解并熟练运用Window对象的属性和方法,开发者可以实现丰富的网页动态效果和用户交互体验。
本篇文章将深入探讨`window.open()`、`window.opener`、`window.name`以及`window`对象的一些核心概念,同时通过两个带有注释的页面示例(001.html和main.html)帮助理解这些知识点。 ### `window.open()` `window...
标题中的“typora-window”指的是在Windows操作系统上使用的Typora编辑器。Typora是一款备受欢迎的Markdown编辑器,它以其极简的用户界面和流畅的写作体验而闻名。接下来,我们将深入探讨Typora的主要特点、功能以及...
总结来说,jquery-accessible-modal-window-aria是Web开发中的一个重要工具,它结合了jQuery的便利性和ARIA的可访问性,为所有用户提供一致且无障碍的交互体验。无论你是新手还是经验丰富的开发者,都应该考虑将这种...
### JavaScript对象大总结 #### B.1 Anchor对象 **定义:** 在HTML中,通过`<a name="..." />`创建的描点可以被其他链接作为目标引用。如果该描点还包含`href`属性,则它同时也是一个链接对象。 **关联性:** ...
总结一下,`window.showModalDialog`更适合需要用户完成特定任务并收集反馈的场合,因为它是阻塞的,用户无法忽略对话框继续操作。而`window.open`则更灵活,常用于打开新的浏览环境,如新标签页或窗口,允许用户...
总结来说,Window对象是JavaScript在浏览器环境中的核心,它提供了与页面和浏览器交互的接口。而Event对象则承载了事件的相关信息,是实现响应式和交互性网页的关键。理解并熟练运用这两个对象,对于进行高效且用户...
window.open('page.html', 'newwindow', 'height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no'); ``` 这将在一个高度为100像素、宽度为400像素、位于...
总结来说,Alert-Window是一个基于JavaScript的插件,用于创建易于定制的警报窗口。它提供了便捷的API,帮助开发者在不牺牲用户体验的前提下,快速集成和自定义警报功能。通过阅读插件的源码和文档,开发者可以深入...
总结起来,"window-jdk-jdk1.6.0_06"是一个针对32位Windows系统的Java Development Kit,包含了开发和运行Java应用程序所需的各种工具和文件。开发者可以利用这个JDK来创建、编译、调试和运行Java代码,同时,通过...
总结,`window.open()`和`window.close()`是JavaScript中处理窗口操作的重要方法,但需要注意浏览器的安全限制和用户体验。在实际开发中,要合理利用这些方法,并结合其他`window`对象的相关属性和方法,实现更灵活...
总结来说,仅使用CSS建立模态窗口涉及的关键点包括HTML结构的布局、CSS定位技术、层叠顺序、伪类选择器和动画效果。通过巧妙地组合这些元素,可以创建一个功能完备且具有良好用户体验的模态窗口,而无需依赖...
以下是一个简单的示例,展示了如何使用 `window.open` 和 `window.opener` 在三个HTML页面(`first.html`、`second.html` 和 `third.html`)之间进行通信: 1. **`first.html`**: - 页面提供了两个按钮:“open” ...
#### 七、区别总结 1. **兼容性差异**:`ShowModalDialog` 不是W3C标准的一部分,仅在某些旧版本的Internet Explorer中支持。而 `window.open` 是W3C推荐的标准API,在所有现代浏览器中均支持。 2. **交互方式**:`...
### Window下Nginx配置详解 #### 一、前言 一直以来,许多开发者都认为Nginx只能在Linux环境下运行,实际上,在Windows系统中同样可以部署并高效运行Nginx。随着网站流量的增长,单台服务器可能无法满足需求,此时...
标题 "php-5.4.45window的官方版本带nts和不带nts" 提供的信息是关于PHP的一个特定版本,即5.4.45,适用于Windows操作系统,并且包括了两个不同的构建:一个带有NTS(Non Thread Safe,非线程安全)支持,另一个没有...
window.open("page2.html", "newwindow2", "height=100,width=100,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no"); } ``` 这段代码同时打开了两个新窗口,并通过 `...