JavaScript Document对象详解：属性与方法实战
本文详解JavaScript中Document对象的核心属性与方法。涵盖标题、颜色、URL及Cookie等属性设置，以及open、write、close等文档操作方法。通过完整的弹出窗口示例代码，演示如何动态生成HTML内容并控制窗口行为，帮助开发者掌握基础DOM操作技巧。
Document对象概述
Document对象用于描述当前窗口或指定窗口所关联的文档，其内容范围涵盖从<head>标签开始到</body>标签结束的所有部分。
在调用时，可直接使用document访问当前窗口的文档对象，或通过<窗口对象>.document的形式访问指定窗口的文档。
核心属性详解
Document对象提供了丰富的属性，用于获取或设置文档的各种状态和外观。
document.title属性用于设置或获取文档标题，其效果等同于修改HTML中的<title>标签内容。
通过document.bgColor属性可以设置页面的背景颜色。
document.fgColor属性用于设置页面前景色，即文本的显示颜色。
document.linkColor属性定义未点击访问过的链接颜色。
document.alinkColor属性指定当鼠标焦点停留在链接上时的激活颜色。
document.vlinkColor属性用于设置已点击访问过的链接颜色。
document.URL属性可获取或设置当前文档的URL，通过修改该属性可在同一窗口中打开另一个网页。
document.fileCreatedDate为只读属性，返回文件创建的日期。
document.fileModifiedDate为只读属性，返回文件最后修改的日期。
document.fileSize为只读属性，返回文件的大小。
document.cookie属性用于设置和读取Cookie数据。
document.charset属性用于设置字符集，例如可设置为简体中文的gb2312。
关于Cookie的具体用法，建议参考“使用框架和Cookies”相关章节以获取更详细的指导。
lastModified属性返回当前文档的最后修改日期，其值为一个Date对象。
referrer属性用于返回当前文档的来源URL，前提是当前文档是通过点击链接跳转打开的。
title属性指代<head>标记中<title>...</title>定义的文字内容。需要注意的是，在Netscape浏览器中，该属性不支持赋值操作。
fgColor属性对应<body>标记中text属性所指定的文本颜色。
bgColor属性对应<body>标记中bgcolor属性所指定的背景颜色。
linkColor属性对应<body>标记中link属性所指定的普通链接颜色。
alinkColor属性对应<body>标记中alink属性所指定的活动链接颜色。
vlinkColor属性对应<body>标记中vlink属性所指定的已访问链接颜色。
文档操作方法
Document对象还包含若干方法，用于控制文档的写入和状态。
open()方法用于打开文档，以便JavaScript向文档当前位置写入数据。通常情况下无需手动调用此方法，JavaScript会在需要时自动执行。
write()和writeln()方法用于向文档写入数据，写入的内容将被解析为标准HTML。两者的区别在于writeln()在写入数据后会添加一个换行符；该换行仅在HTML结构中有效，具体显示效果取决于JavaScript插入的位置。例如，若嵌入在<pre>标记中，换行将直接体现在文档显示中。
clear()方法用于清空当前文档的所有内容。
close()方法用于关闭文档并停止数据写入。若使用了write[ln]()或clear()方法，必须调用close()以确保更改生效并显示出来。如果JavaScript代码直接嵌入在尚未完全读取的文档中，则无需使用此方法。
弹出窗口实战示例
基于上述知识，我们可以实现许多网站常见的弹出式更新通知功能。
具体实现代码如下：
<script language="JavaScript">
var whatsNew = open('','_blank','top=50,left=50,width=200,height=300,' +
'menubar=no,toolbar=no,directories=no,location=no,' +
'status=no,resizable=no,scrollbars=yes');
whatsNew.document.write('<center><b>更新通知</b></center>');
whatsNew.document.write('<p>最后更新日期：00.08.01');
whatsNew.document.write('<p>00.08.01：增加了“我的最爱”栏目。');
whatsNew.document.write('<p align="right">' +
'<a href="javascript:self.close()">关闭窗口</a>');
whatsNew.document.close();
</script>此外，也可以预先编写好一个HTML文件，并在open()方法中直接加载该文件以实现类似效果。
vtk.js 渲染窗口黑屏或无内容显示的常见原因及排查
2026-11-05 17:30:30
js-cookie 安装与基础用法：set、get、remove 详解
2026-11-05 16:35:06
适合JavaScript初学者的实战项目：制作简易待办事项列表
2026-11-05 16:17:07
JS打开新标签页时怎么通过URL传递参数
2026-11-05 12:21:08
sigma.js 自定义节点样式：设置颜色、大小及标签显示的技巧
2026-11-05 09:55:00