JavaScript Window及Document对象详细整理
在 JavaScript 中，Window 和 Document 是两个常用的对象，它们分别代表浏览器窗口和文档模型。本文将详细讲解它们的各种属性和方法。
Window 对象
Window 对象是 JavaScript 代码的全局对象，即在浏览器中，它代表整个浏览器窗口。在没有指定父窗口的情况下，每个浏览器窗口和标签页均为一个独立的窗口对象。
常用属性
window.innerHeight：浏览器窗口的视口高度（不含工具栏等）window.innerWidth：浏览器窗口的视口宽度（不含工具栏等）window.location：地址栏信息，包括 URL、主机名、路径、hash 值等window.opener：打开当前窗口的窗口对象window.parent：当前窗口的父窗口对象，对于顶层窗口则为自身window.top：整个窗口继承层次中最上层的窗口对象，对于最上层窗口则为自身
常用方法
window.alert(message)：弹出带有一段消息和一个确定按钮的对话框window.confirm(message)：弹出一个带有一个消息、确定和取消按钮的对话框。点击确定返回 true，点击取消返回falsewindow.open(url, name, features)：打开一个新窗口或标签页并加载指定 URL 的文档window.close()：关闭当前窗口
示例说明
// 打开一个新窗口
var newWindow = window.open("https://www.baidu.com", "newWindow", "height=500,width=500");
// 关闭当前窗口
window.close();
Document 对象
Document 对象是通过 JavaScript 访问 HTML 文档的入口点，它代表网页的 DOM 树，包含了整个文档的内容，比如 HTML 标签、文本、注释以及元素的属性等等。
常用属性
document.title：网页标题document.URL：页面地址document.body：页面主体的元素document.head：文档头元素
常用方法
document.getElementById(id)：获取页面中指定的元素document.querySelectorAll(selector)：返回文档中匹配指定 CSS 选择器的所有元素列表document.createElement(tagName)：创建指定名称的 HTML 元素document.createTextNode(text)：创建文本节点
示例说明
<!DOCTYPE html>
<html>
<head>
<title>Document 对象示例</title>
</head>
<body>
<p id="demo">这是一个段落</p>
<button onclick="changeText()">点击我</button>
<script>
// 改变文本内容
function changeText() {
var elem = document.getElementById("demo");
elem.innerHTML = "文本内容已更改";
}
</script>
</body>
</html>
以上为 JavaScript Window 及 Document 对象的详细整理。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：javascript Window及document对象详细整理 - Python技术站
微信扫一扫 
支付宝扫一扫 