📄 js6.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0055)http://www.pinluo.com/book/javascript/js6.htm -->
<HTML><HEAD><TITLE>第六讲 使用内部对象系统 - 品络科技 pinluo.com</TITLE>
<META http-equiv=Content-Language content=zh-cn>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE>TABLE.MsoNormalTable {
FONT-SIZE: 10pt; FONT-FAMILY: "Times New Roman"; mso-style-parent: ""
}
</STYLE>
<META content="MSHTML 6.00.2800.1476" name=GENERATOR></HEAD>
<BODY>
<DIV align=center>
<TABLE id=table1 height=607 cellSpacing=0 cellPadding=0 width=800
background=js6.files/sc1.jpg border=0>
<TBODY>
<TR>
<TD>
<DIV align=center>
<TABLE id=table2 cellSpacing=0 cellPadding=0 width=560 border=0>
<TBODY>
<TR>
<TD>
<P align=center>
<P align=center> </P></TD></TR>
<TR>
<TD>
<P align=center><IMG height=34 src="js6.files/sc.jpg" width=226
border=0></P></TD></TR>
<TR>
<TD>
<P align=center>
<P align=center><FONT color=#ff0000>第六讲 使用内部对象系统</FONT>
<P> <FONT size=2>使用浏览器的内部对象系统,
可实现与HTML文档进行交互。它的作用是将相关元素组织包装起来，提供给程序设计人员使用，从而减轻编程人的劳动，提高设计Web页面的能力。</FONT>
<P><FONT size=2>一、浏览器对象层次及其主要作用</FONT>
<P><FONT size=2>
除了前面提到过的文档document对象外，Navigator浏览器中还提供了窗口（Window）对象以及历史（History）和位置（Location）对象。<BR>
浏览器对象(Navigator)<BR>
提供有关浏览器的信息<BR> 窗口对象(Windows)<BR>
Window对象处于对象层次的最顶端，它提供了处理Navigator窗口的方法和属性。<BR>
位置对象(Location)<BR>
Location对象提供了与当前打开的URL一起工作的方法和属性，它是一个静态的对象。<BR>
历史对象(History)<BR>
History对象提供了与历史清单有关的信息。<BR> 文档对象(Document)
<BR>
document对象包含了与文档元素(elements)一起工作的对象，它将这些元素封装起来供编程人员使用。</FONT>
<P><FONT size=2>
编程人员利用这些对象，可以对WWW浏览器环境中的事件进行控制并作出处理。在JavaScript中提供了非常丰富的内部方法和属性,从而减轻了编程人员的工作,提高编程效率。这正是基于对象与面向对象的根本区别所在。在这些对象系统中,文档对象属于非常重要的,它位于最低层,但对于我们实现Web页面信息交互起作关键作用。因而它是对象系统的核心部分。</FONT>
<P><FONT
size=2>二、文档对象功能及其作用<BR>在Navigator浏览器中，document文档对象是核心是，同时也是最重要的。见图6-1所示。</FONT>
<P>
<TABLE class=MsoNormalTable id=table3
style="BORDER-RIGHT: black 1pt outset; BORDER-TOP: black 1pt outset; BORDER-LEFT: black 1pt outset; WIDTH: 392.25pt; BORDER-BOTTOM: black 1pt outset"
cellSpacing=1 cellPadding=0 width=523 border=1>
<TBODY>
<TR>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 19.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="19%"><SPAN lang=EN-US
style="FONT-FAMILY: 宋体">Links</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 17.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="17%"><SPAN lang=EN-US
style="FONT-FAMILY: 宋体">Anchor</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 17.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="17%"><SPAN lang=EN-US
style="FONT-FAMILY: 宋体">Form</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 19.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="19%"><SPAN lang=EN-US
style="FONT-FAMILY: 宋体">Method</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 23%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="23%"><SPAN lang=EN-US
style="FONT-FAMILY: 宋体">Prop</SPAN><SPAN lang=EN-US>
</SPAN></TD></TR>
<TR>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 19.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="19%"><SPAN
style="FONT-FAMILY: 宋体">链接对象</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 17.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="17%"><SPAN
style="FONT-FAMILY: 宋体">锚对象</SPAN><SPAN lang=EN-US> </SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 17.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="17%"><SPAN
style="FONT-FAMILY: 宋体">窗体对象</SPAN><SPAN lang=EN-US>
</SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 19.98%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="19%"><SPAN
style="FONT-FAMILY: 宋体">方法</SPAN><SPAN lang=EN-US> </SPAN></TD>
<TD
style="BORDER-RIGHT: black 1pt inset; PADDING-RIGHT: 5.25pt; BORDER-TOP: black 1pt inset; PADDING-LEFT: 5.25pt; PADDING-BOTTOM: 5.25pt; BORDER-LEFT: black 1pt inset; WIDTH: 23%; PADDING-TOP: 5.25pt; BORDER-BOTTOM: black 1pt inset"
vAlign=top width="23%"><SPAN
style="FONT-FAMILY: 宋体">对象</SPAN><SPAN lang=EN-US>
</SPAN></TD></TR></TBODY></TABLE>
<P><FONT size=2>
从图中可以看出，document对象的主要作用就是把这些基本的元素（如links,anchor等）包装起来，提供给编程人员使用。从另一个角度看，document对象中又是由属性和方法组成。</FONT>
<P><FONT size=2>1.document中三个主要的对象</FONT>
<P><FONT size=2>
在document中主要有：links,anchor,form等三个最重要的对象：</FONT>
<P><FONT size=2>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -