目录
(1) fileCreatedDate 属性fileCreatedDate属性用来获取文档的创建日期。
(2) fileModifiedDate 属性fileModifiedDate属性用来获取文档最后修改的日期。
(3) lastModified 属性lastModified属性用来获取文档最后修改的时间。
(4) fileSize属性fileSize属性用来获取文档的大小。
文档对象概述
文档对象(document) 代表浏览器窗口中的文档,该对象是window对象的子对象,由于window对象是DOM对象模型中的默认对象,因此window对象中的方法和子对象不需要使用window来引用。通过document对象可以访问HTML文档中包含的任何HTML标记,并可以动态地改变HTML标记中的内容,例如表单、图像、表格和超链接等。该对象在JavaScript 1.0 版本中就已经存在,在随后的版本中又增加了几个属性和方法。
document对象层次结构如图所示。
文档对象的常用属性、方法和事件
document对象的属性
| 属性 | 说明 |
|---|---|
| alinkColor | 超链接文字的颜色,对应于标记中的alink属性 |
| all[ ] | 存储HTML标记的一个数组(该属性本身也是一个对象) |
| anchors[ ] | 存储锚点的一个数组(该属性本身也是一个对象) |
| bgColor | 文档的背景颜色 |
| cookie | 表示cookie的值 |
| fgColor | 文明的文本颜色(不包含超链接的文字)对应于标记中的text属性 |
| forms[ ] | 存储窗体对象的一个数组(该属性本身也是一个对象) |
| fileCreateDate | 创建文档的日期 |
| fileModifiedDate | 文档的最后修改日期 |
| fileSize | 当前文件的大小 |
| lastModified | 文档的最后修改时间 |
| images[ ] | 存储图像对象的一个数组(该属性本身也是一个对象) |
| linkColor | 未被访问的超链接文字的颜色,对应标记中的link属性 |
| links[ ] | 存储link对象的一个数组(该属性本身也是一个对象) |
| vlinkColor | 表示已访问的超链接文字的颜色,对应于标记的vlink属性 |
| title | 当前文档标题对象 |
| body | 当前文档主体对象 |
| readyState | 获取某个对象的当前状态 |
| URL | 获取或设置URL |
document对象的方法
| 方法 | 说明 |
|---|---|
| close | 文档的输出流 |
| open | 打开一个文档输出流并接收write()和writeln()方法的创建页面内容 |
| write | 向文档中写入HTML或JavaScript语句 |
| writeln | 向文档中写入HTML或JavaScript语句,并以换行符结束 |
| createElement | 创建一个指定的HTML标记 |
| getElementById | 获取指定id的HTML标记 |
document对象的事件
多数浏览器内部对象都拥有很多事件,下面将以表格的形式给出常用的事件及何时触发这些事件。
| 事件 | 何时触发 |
|---|---|
| onabort | 对象载入被中断时触发 |
| onblur | 元素或窗口本身失去焦点时触发 |
| onchange | 改变select元素中的选项或其他表单元素失去焦点,并且在其获取焦点后的内容发生过改变时触发 |
| onclick | 单击时触发。当光标的焦点在按钮上,并按下enter键时,也会触发该事件 |
| ondblclick | 双击时触发 |
| onerror | 出现错误时触发 |
| onfocus | 任何元素或窗口本身获得焦点时触发 |
| onkeydown | 键盘上的按键(包括Shift或Alt等键)被技下时触发,如果一直按着某键,则会不断触发。当返回false时,取消默认动作 |
| onkeypress | 键盘上的按键被按下,并产生一个字符时发生。也就是说,当按下Shift或Alt等键时不触发。如果一直按着某键,会不断触发。当返回false 时,取消默认动作 |
| onkeyup | 释放键盘上的按键时触发 |
| onload | 页面完全载入后,在window对象上触发;所有框架都载入后,在框架集上触发: |
| onmousedown | 单击任何一个鼠标按键时触发 |
| onmousemove | 鼠标指针在某个元素上移动时持续触发 |
| onmouseout | 将鼠标指针从指定的元素上移开时触发 |
| onmouseover | 将鼠标指针移到某个元素上时触发 |
| onmouseup | 释放任意一个鼠标按键时触发 |
| onreset | 单击“重置”按钮时,在上触发 |
| onresize | 窗口或框架的大小发生改变时触发 |
| onscroll | 在任何带滚动条的元素或窗口上滚动时触发 |
| onselect | 选中文本时触发 |
| onsubmit | 单击“提交”按钮时,在上触发 |
| onunload | 页面完全卸载后,在window对象上触发;或者所有框架都卸载后,在框架集上触发 |
document对象的应用
查看文档创建日期、修改日期和文档大小
查看文档创建日期、修改日期和文档大小,可以使用fileCreatedDate属性、fileModifiedDate属性、lastModified属性和fileSize属性来实现。
(1) fileCreatedDate 属性 fileCreatedDate属性用来获取文档的创建日期。
语法:
[date=]fileCreatedDate
参数说明:
date:可选项。字符串变量,用来存储文档的创建日期。
(2) fileModifiedDate 属性 fileModifiedDate属性用来获取文档最后修改的日期。
语法:
[date=]ileModifiedDate
(3) lastModified 属性 lastModified属性用来获取文档最后修改的时间。
语法:
[date=]lastModified
参数说明:
date:可选项。字符串变量,用来存储文档最后修改的时间。
(4) fileSize属性 fileSize属性用来获取文档的大小。
语法:
[size=]fileSize
参数说明:
size:可选项。字符串变量,用来存储文档大小
例子:查看文档创建日期、修改日期和文档大小
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>查看文件创建日期、修改日期和文档大小</p>
<br />
<script>
document.write("<b>该文档创建日期: </b>"+document.fileCreatedDate+"<br />");
document.write("<b>该文档修改日期: </b>"+document.fileModifiedDate+"<br />");
document.write("<b>该文档修改时间: </b>"+document.lastModified+"<br />");
document.write("<b>该文档大小: </b>"+document.fileSize+"<br />");
</script>
</body>
</html>
动态标题栏
设置动态标题栏可以使用title属性来实现。该属性用来获取或设置文档的标题。
语法:
[Title=]document.title[=setTitle]
参数说明:
Title:可选项,字符串变量,用来存储文档的标题
setTitle:可选项。用来设置文档的标题
例子:在浏览网页时,经常会看到一些IE浏览器中标题栏的信息不停地闪动或变换。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p></p>
<br />
<script>
var n=0;
function title(){
n++;
if(n==4) n=1;
if(n==1) document.title='(-.-)';
if(n==2) document.title='(^.^)';
if(n==3) document.title='(~.~)';
setTimeout("title()",1000);
}
title();
</script>
</body>
</html>
获取并设置URL
获取并设置URL主要可以使用URL属性来实现。该属性用来获取或设置当前文档的URL。
语法:
[url=]document.URL[=setUrl]
参数说明:
url:可选项。字符串表达式,用来存储当前文档的URL。
setUrl:可选项。字符串变量,用来设置当前文档的URL。
例子:获取并设置URL
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
document.write("<b>当前页面的URL: </b>"+document.URL);
function seturl(){
document.URL=t;
var u=document.URL;
return u;
}
</script>
<p>
转入要跳转的页面URL:
<input name="name" type="text" />
<input name="input" value="跳转" onclick="seturl(name.value)" type="button" />
</p>
</body>
</html>
获取对象的当前状态
在文档中获取某个对象的当前状态可以使用readyState属性来实现。
语法:
[state=]obj.readyState
状态值及说明
| 状态栏 | 说明 |
|---|---|
| loading | 表示该对象正在载入数据 |
| loaded | 表示该对象载入数据完成 |
| interactive | 用户可以和该对象进行交互,不管对象是否已经加载完毕 |
| complete | 该对象初始化完毕 |
例子:获取对象的当前状态
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
document.write("<br /><b>document对象当前状态: </b>"+document.readyState+"<br />");
</script>
</body>
</html>