浏览器对象中的document如何使用?

 我来答
若以下回答无法解决问题,邀请你更新回答
百度网友26ad221c8
2006-08-02
知道答主
回答量:11
采纳率:0%
帮助的人:0
展开全部
使用浏览器对象
1.文档对象模型
文档对象模型(Document Obiect Model,简称DOM)是用于表示HTML元素以及Web浏览器信息的一个模型,它使脚本能够访问Web页上的信息,并可以访问诸如网页位置等特殊信息。通过操纵文档对象模型中对象的属性并调用其方法,可以使脚本按照一定的方式显示Web页并与用户的动作进行交互。
对于不同的脚本语言,通常都具有一个DOM的子集,以便在特定的脚本语言中实现对象模型。例如,JavaScript在其语言中就有一个对象模型。对于Intemet Explorer,Microsoft公司专门高孝为其创建了一个对象模型。使用为浏览器创建对象模型的方式使得对象模型与语言无关,从而可以获得更强的可扩展性。
JavaScript对象模型和IE对象模型非常相象,它们包含相似的对象和事件,反映了如图所示的对象层次结构:
window.....document....anchor,applet,area,embed,image,link,
form........button,checkbox,fileupload,
hidden,option,password,fadio,reset,select
submit,text,textarea
.....event,fraem,history,location,screen,
navigator....mimetype,plugin
在该层次结构中,最高层的对象是窗口对象(window),它代表当前的浏览器窗口;之下是文档(document)、事件(event)、框架(frame)、历史(history)、地址(location)、浏览器(navigator)和屏幕(screen)对象;在文档对象之下包括表单(form)、图像(image)和链接(1ink)等多种对象;在浏览器对象之下包括MIME类型对象(mimeType)和插件(plugin)对象;在表单对象之下还包括按钮(button)、复选框(checkbox)、文件选择框(fileUpload)等多种对象。
了解了浏览器对象的层次结构之后,我们就可以用特定的方法引用这些对象,以便在脚本中正确地使用它们。
在JavaScript中引用对象的方式与典型的面向对象方法相同,都是根据对象的包含关系,使用成员引用操作符(.)一层一层地引用对象。例如,如果要引用document对象,应使用window.document;如果要引用location对象,应使用window.location。由于window对象是默认的最上层对象,因此引用它的子对象时,可以不使用window.,也就是说,可以直接用document引用document对象,用location引用location对象。
当引用较低层次的对象时,一般有两种方式——使用对象索引或使用对象名称(或ID)。例如,如果要引用文档中的第一个表单对象,则可以用document.forms[0]来引用;如果该表单核念核的name属性为 form1 (或者 ID属性为 form1), 则可以用document.forms["form1"]或直接用document.form1来引用该表单。同样,如果在名称为form1的表单中包括一个名称为myText的文本框,则可以用document.form1.myText来引用该文本框对象。
说明:由于name和ID属性的值使用相同的名字空间, 因此最改掘好只使用其中一种,以免造成混淆。也就是说,在FORM标记符中,最好只指定name属性和ID属性中的一种,并且不论是名称还是ID,都不能重复。
对应于不同的对象,通常还有一些特殊的引用方法。例如,如果要引用表单对象中包含的对象,可以使用elements数组;如果要引用文档对象中包含的某个标记符对象(例如 P 对象),可以使用document对象的all属性,等等。
2.document对象
document对象代表当前浏览器窗口中的文档,使用它可以访问到文档中的所有其他对象(例如图像、表单等),因此该对象是实现各种文档功能的最基本对象。
1.document对象的常用属性
document对象最常用的属性如下:
all 表示文档中所有HTML标记符的数组;
bgcolor 表示文档的背景颜色;
forms 表示文档中所有表单的数组;
title 表示文档的标题。
例如,以下示例显示了all属性和bgcolor属性的用法,效果...
<HTML>
<HEAD>
<TITLE>动态更改背景颜色</TITLE>
<SCRIPT language="JavaScript" type="text/javascript">
<!--
function changeBGColor()
{ document.bgColor=document.all.myForm.myBGColor.value; }
// -->
</SCRIPT>
</HEAD>
<BODY>
<H2>请在文本框中输入十六进制颜色值
(例如:#00ffff),然后单击"变!"按钮:</H2>
<FORM name="myForm">
<INPUT name="myBGColor" value="#ffffff"><P>
<INPUT type="button" value="变!" onclick="changeBGColor()"><P>
</FORM>
</BODY>
</HTML>
2.document对象的常用事件
在客户端脚本中,JavaScript通过对事件进行响应来获得与用户的交互。例如,当用户单击一个按钮或者在某段文字上移动鼠标时,就触发了一个单击事件或鼠标移动事件,通过对这些事件的响应,可以完成特定的功能(例如,单击按钮弹出对话框,鼠标移动到文本上后文本变色等)。
实际上,事件(event)在此的含义就是用户与Web页面交互时产生的操作。当用户进行单击按钮等操作时,即产生了一个事件,需要浏览器进行处理。浏览器响应事件并进行处理的过程称为事件处理,进行这种处理的代码称为事件响应函数。
在前面我们已经多次见过onclick事件,它表示鼠标单击时产生的事件。对于document对象来说,还有两个非常常用的事件,即:onload和onunload,分别在文档装载完毕和卸载(或从当前页跳转到其他页)完毕时发生。
以下示例显示了这两个事件的作用(当进入页面时,显示“欢迎光临”对话框;退出网页时,显示“谢谢惠顾”对话框)。效果...
<HTML>
<HEAD>
<TITLE>处理加载卸载事件</TITLE>
</HEAD>
<BODY onload="alert('欢迎光临!')" onunload="alert('谢谢惠顾!')">
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式