JavaScript入门：深入理解Window对象

158 浏览量更新于2024-08-31 收藏 117KB PDF 举报

"这篇教程介绍了JavaScript入门中的window对象，包括其作为BOM核心的地位，全局window对象的概念，window与self对象的关联，以及window的一些主要子对象和控制函数。" 在JavaScript中，`window`对象扮演着至关重要的角色，它是浏览器对象模型（BOM）的基础，几乎所有的BOM对象都是`window`的子对象。这意味着，JavaScript中的任何全局变量或函数，实际上都是`window`对象的属性。例如，在给定的代码段中，定义了一个全局变量`name`，然后通过`window.name`访问它，证明了这一点： ```javascript var name = "撼地神牛"; document.write(window.name); ``` `self`对象与`window`对象的关系密切，它们代表了当前的窗口上下文。在JavaScript中，`self`始终等于`window`，用来确认操作的是当前窗口。下面的代码示例展示了`window`、`self`和`window.self`之间的等价性： ```javascript document.write(window == self); // 必须相等，永远都相等 document.write(window.top == window.self); // 判断当前框架是否是主框架 ``` `window`对象还拥有多个重要的子对象，如： - **document对象**：表示HTML文档，提供了操作页面元素的方法和属性。 - **frames对象**：如果页面有框架，可以用来引用框架内的窗口。 - **history对象**：允许访问浏览器的历史记录。 - **location对象**：包含了当前URL的信息，并能用于导航。 - **navigator对象**：提供了关于用户浏览器的信息。 - **screen对象**：提供了关于用户屏幕的详细信息。此外，`window`对象还提供了一系列的函数，用于控制窗口的行为，这些函数在Internet Explorer中可能更常见，但在其他现代浏览器中也有相应的替代方法。例如： - **moveBy()**：根据指定的像素值移动窗口的位置。 - **moveTo()**：将窗口移动到屏幕上的特定坐标。 - **resizeBy()**：按给定的像素值改变窗口的大小。 - **resizeTo()**：将窗口的大小设定为特定的像素值。以下是一个使用`resizeTo()`函数的例子，展示了如何通过点击按钮来改变窗口的大小： ```html <body> <input type="button" id="btn1" value="先设置窗体固定大小！" onclick="window.resizeTo(500, 500);" />  </body> ``` 理解`window`对象及其相关的属性和方法对于JavaScript初学者来说至关重要，因为它构成了与浏览器交互的基础。熟悉这些概念和用法，可以帮助开发者更好地控制网页行为和交互。

javascript入门之入门之window对象【新手必看】对象【新手必看】

window ：window对象是BOM中所有对象的核心，除了是BOM中所有对象的父对象外，还包含一些窗口控制函数。

1、全局的、全局的window对象对象

JavaScript中的任何一个全局函数或变量都是window的属性。

var name="撼地神牛";

document.write(window.name);

</script>

2、、window与与self对象对象

　self对象与window对象完全相同，self通常用于确认就是在当前的窗体内。

document.write(window == self);　　　　　　//必须相等，永远都相等

　　document.write(window.Top == window.self);　　//判断当前框架是否是主框架

</script>

　　window、self、window.self三者是等价的。

3、、window的子对象的子对象

　window的主对象主要有如下几个：

JavaScript document 对象

JavaScript frames 对象

JavaScript history 对象

JavaScript location 对象

JavaScript navigator 对象

JavaScript screen 对象

4、、window函数索引函数索引(仅对仅对IE有效有效)

　　窗体控制函数：

JavaScript moveBy() 函数：从当前位置水平移动窗体x个像素，垂直移动窗体y个像素，x为负数，将向左移动窗体，y为负

数，将向上移动窗体。

JavaScript moveTo() 函数：移动窗体左上角到相对于屏幕左上角的(x,y)点，当使用负数做为参数时会把窗体移出屏幕的可视

区域。

JavaScript resizeBy() 函数：相对窗体当前的大小，宽度调整w个像素，高度调整h个像素。如果参数为负值，将缩小窗体，反

之扩大窗体。

JavaScript resizeTo() 函数：把窗体宽度调整为w个像素，高度调整为h个像素。

<body>

</body>

　窗体滚动轴控制函数：

JavaScript scrollTo() 函数：在窗体中如果有滚动条，将横向滚动条移动到相对于窗体宽度为x个像素的位置，将纵向滚动条移

动到相对于窗体高度为y个像素的位置。

JavaScript scrollBy() 函数：如果有滚动条，将横向滚动条移动到相对于当前横向滚动条的x个像素的位置(就是向左移动x像

素)，将纵向滚动条移动到相对于当前纵向滚动条高度为y个像素的位置(就是向下移动y像素)。

注意区别，一个是相对当前窗口，一个是相当现在滚动条的位置。

下载后可阅读完整内容，剩余4页未读，立即下载

weixin_38695061

粉丝: 4
资源: 931

JavaScript入门：深入理解Window对象

javascript 入门教程

深入理解window对象与JavaScript核心技术

JavaScript与浏览器对象速查：入门必备

JavaScript教程：从入门到精通-对象操作详解

韩顺平JavaScript入门到实践详解

JavaScript入门教程：从基础到实战

JavaScript入门：创建Hello World弹窗指南

JavaScript入门教程：编写第一个程序

javascript入门笔记：语法详解与基础操作

JavaScript入门：关键点、常见错误与数据类型详解

最新资源