事件和window对象.pdf

在JavaScript中，事件是用户与网页交互时发生的特定情况，比如点击按钮、输入文本等。这些事件可以触发预先定义的函数来执行相应的操作。在HTML中，我们可以使用事件处理程序（事件监听器）来绑定函数到这些事件。事件处理程序通常以`on`开头，例如`onclick`、`onchange`等。 1. `onclick`事件：当用户单击元素时触发。例如，在HTML中，我们可以在按钮元素上设置`onclick`属性，将其关联到一个JavaScript函数，以便在点击按钮时执行该函数。 ```html <input type="button" value="点击我" onclick="myFunction();"/> ``` 2. `onchange`事件：当元素内容改变时触发，常见于输入框。如果用户在输入框中输入新内容，然后失去焦点，`onchange`事件会被触发。 3. `onblur`事件：当元素失去焦点时触发，例如用户点击页面上的其他位置。 4. `onfocus`事件：当元素获得焦点时触发，比如用户点击输入框使其变为活动状态。 在JavaScript中，`this`关键字在函数中表示当前上下文的对象。在事件处理函数中，`this`通常指的是触发事件的元素。例如： ```javascript function show(a) { alert(a.value); } ``` 在这个例子中，`show`函数会在按钮被点击时执行，`a`参数会引用到触发事件的按钮元素，`this`也指向这个按钮。 `window`对象是JavaScript中的全局对象，代表浏览器的窗口。它提供了一些重要的属性和方法，包括： - `close()`：关闭当前窗口。 - `open(url, target, features)`：打开一个新的浏览器窗口或标签页，`url`是要加载的页面地址，`target`指定窗口目标，`features`是窗口特性，如宽度、高度等。 - `location`：这个属性用于获取或设置当前页面的URL。例如，`location.href`可以获取当前URL，`location.href = 'http://example.com'`可以重定向到新的URL。 此外，`document`对象是HTML文档的根对象，它提供了访问和操作HTML元素的方法。例如，`getElementById(id)`根据给定的ID获取元素。在示例代码中，有这样一个用法： ```javascript var btn2 = document.getElementById("btn2"); ``` 这段代码获取了ID为"btn2"的按钮元素，然后可以对其进行操作，如改变其值或类型。 在给定的作业中，提到了一些任务，如： 2. 显示密码：这可以通过添加一个切换按钮，改变输入类型的`type`属性，从`password`变为`text`，以显示隐藏的密码。 3. 打开窗口访问百度：使用`window.open('https://www.baidu.com')`。 4. 关闭窗口：使用`window.close()`。 5. 在当前窗口访问百度：使用`window.location.href = 'https://www.baidu.com'`。 6. 更复杂的交互可能需要更深入的事件监听和处理，以及对DOM的更高级操作。 总结来说，事件和window对象是JavaScript在Web开发中实现用户交互和页面控制的关键概念。通过理解并熟练运用它们，开发者可以创建更加动态和响应式的网页应用。