表示整个浏览器窗口,不必表示其中包含的内容。还可用于移动或调整它表示的浏览器的大小。如果页面使用框架集合,每个框架都由它自己的window对象表示,存放在frames集合中。
可以用window.frames[0]或window.frames[“topFrame”]引用框架,也可以用top对象代替window对象。Window对象可省略。(曾经做了个
<o:p></o:p>
页面,非得top才能定位,不解)
Window另一个实例是parent。Parent对象指的是包含上一层框架,浏览器窗口自身被看作所有顶层框架的父框架。
1 窗口操作
moveBy(dx,dy)――把浏览器窗口相对移动。
moveBy(dx,dy)――移动浏览器窗口到(x,y)处。
resizeBy(dw,dh)――相对于当前窗口,调整dw,dh个象素。
resizeTo(w,h)―――绝对调整。
IE提供了window.screenlLeft和window.screenTop对象来判断窗口的位置,用document.body.offsetWidth和document.body.offsetHeight属性可以获取视口的大小,但不是标准属性。
2 导航和打开新窗口
Window.open( “url”, “新窗口名称”, “left,top,height,width, resizable, scrollable, toolbar,
Status, location”)
3 系统对话框
Alert()
confirm()返回一个boolean值
prompt(“显示给用户的文本”,默认文本) 函数值返回。
4 状态栏
Status 和 defaultStatus属性
5 时间间隔和暂停
setTimeout(“alert(‘hello world!’)”,1000)一秒之后显示一条警告
可调用clearTimeout(iTimeoutID)取消,用在鼠标停在一个按钮上,一会出现帮助信息,如果移动太快则不显示。
setInterval()
clearInterval();
6 历史
Window.history.go(-1) history.back()
History.go(1) history.forward()
<o:p> </o:p>
Document对象<o:p></o:p>
这个对象的独特之处是它是既属于BOM又属于DOM。<o:p></o:p>
属性:alinkColor 激活的链接的颜色 bgColor 页面的背景颜色<o:p></o:p>
fgColor 页面的文本颜色 lastModified 最后修改页面的日期<o:p></o:p>
linkColor 连接的颜色 referrer 浏览器历史中后退一个位置的URL<o:p></o:p>
title URL vlinkColor 访问过的链接的颜色<o:p></o:p>
document对象也有许多集合, anchors, applets, embeds, forms,images, links.<o:p></o:p>
方法 write() writeln() open() close() <o:p></o:p>
<o:p> </o:p>
Location对象<o:p></o:p>
Location对象表示载入窗口的URL,此外,它还可以解析URL:该对象是window和document的属性。<o:p></o:p>
Hash--如果URL包含#,该方法将返回该符号之后的内容。<o:p></o:p>
Host――服务器的名字<o:p></o:p>
Hostname――通常等于host。<o:p></o:p>
Href ――完整的URL。<o:p></o:p>
Pathname――URL中主机名后的部分。<o:p></o:p>
Port――端口。<o:p></o:p>
Protocol――协议。<o:p></o:p>
Search――查询字符串。<o:p></o:p>
Location.href() = location.assign() = Location.replace()(不能后退)<o:p></o:p>
Location.reload(false) 从缓存中重载,true为服务器端载入。默认false。<o:p></o:p>
toString(),返回location.href的值。 <o:p></o:p>
<o:p> </o:p>
Navigator对象<o:p></o:p>
该对象包含大量有关web浏览器的信息,是window对象的属性。<o:p></o:p>
appCodeName, appName, appMinorVersion, appVersion,browserLanguage,<o:p></o:p>
cookieEnabled, cpuClass javaEnabled(),language,mimeTypes,online<o:p></o:p>
oscpu,platform,plugins,preference(),product,productSub,opsProfile,<o:p></o:p>
securityPolicy,systemLanguage,taintEnabled(),userAgent,userLanguage,<o:p></o:p>
userProfile,vendor,vendorSub.<o:p></o:p>
Screen 对象<o:p></o:p>
获取某些关于用户屏幕的信息。<o:p></o:p>
availHeigh――窗口可以使用的屏幕的高度,包括操作系统元素(如windows工具栏)需要的空间。<o:p></o:p>
availWidth――可以使用的屏幕的宽度<o:p></o:p>
colorDepth――用户表示颜色的位数。大多32位。<o:p></o:p>
Height――屏幕的高度,以象素计。<o:p></o:p>
Width――屏幕的宽度。<o:p></o:p>
<o:p> </o:p>
<o:p> </o:p>
DOM<o:p></o:p>
Document――最顶层的节点,所有的其他节点都是附属于它的。<o:p></o:p>
Document――DTD引用(使用语法)的对象表现形式。它不能包含字节点。<o:p></o:p>
DocumentFragment――可以像Document一样来保存其他节点。<o:p></o:p>
Element――表示起始标签和结束标签之间的内容。可以同时包含特性和子节点的节点类型。<o:p></o:p>
Attr――代表一对特性名和特性值。<o:p></o:p>
Text――代表XML文档中的在起始标签和结束标签之间,或者CData Section内包含的普通文本。<o:p></o:p>
CDataSection――的对象表现形式。这个节点类型仅能包含文本节点作为子节点。<o:p></o:p>
Entity――表示在DTD中的一个实体定义,例如。<o:p></o:p>
EntityReference――代表一个实体引用,例如"。<o:p></o:p>
ProcessingInstruction――代表一个PI。<o:p></o:p>
Comment――代表XML注释。<o:p></o:p>
Notation――代表在DTD中定义的记号。<o:p></o:p>
<o:p> </o:p>
Node接口定义了所有节点类型都包含的特性和方法。<o:p></o:p>
nodeName, nodeValue; nodeType,ownerDocument,firstchild,lastchild,childNodes,<o:p></o:p>
previousSibling,nextSibling,haschildNodes(),attributes,appendchild(node),removechild(node),replacechild(new,old),insertBefore(new,ref);<o:p></o:p>
访问相关的节点<o:p></o:p>
Document.documentElement 访问元素<o:p></o:p>
检测节点类型
例如 document.documentElement.nodeType IE不支持node定义的常量。<o:p></o:p>
处理特性<o:p></o:p>
getNamedItem(name)――返回nodeName属性值等于name的节点。<o:p></o:p>
removeNamedItem(name)<o:p></o:p>
setNamedItem(node)<o:p></o:p>
item(pos)――像NodeList一样,返回在位置pos的节点。<o:p></o:p>
例如:
1”>hello world!
<o:p></o:p>假设op包含指向这个元素的一个引用,可以这样访问id特性的值<o:p></o:p>
op.attributes.getNamedItem(“id”).nodeValue;<o:p></o:p>
这种方法有些累赘,DOM又定义了三个元素方法来帮助访问这些特性<o:p></o:p>
getAttribute(name) setAttribute(name,newvalue) removeAttribute(name) <o:p></o:p>
上面的例子可以这样表示 op.getAttribute(“id”);<o:p></o:p>
<o:p> </o:p>
访问指定节点<o:p></o:p>
getElementsByTagName()<o:p></o:p>
getElementsByName()<o:p></o:p>
getElementsById()<o:p></o:p>
<o:p></o:p>
创建和操作节点<o:p></o:p>
1常用的几个方法<o:p></o:p>
createDocumentFragment() createElement() createTextNode() <o:p></o:p>
2 创建一个新节点 createElement() createTextNode() appendChild()<o:p></o:p>
3 removechild() repalacechild() insertBefore() <o:p></o:p>
4 createDocumentFragment() 创建一个文档碎片把所有的新节点附加其上,一次刷新。<o:p></o:p>
<o:p> </o:p>
HTML DOM特征功能<o:p></o:p>
0” /><o:p></o:p>
核心的DOM 获取和设置src和border属性,那么要用getAttribute()和setAttribute()<o:p></o:p>
HTML DOM可以使用同样名称的属性来获取和设置这些值。<o:p></o:p>
oImg.src oImg.border<o:p></o:p>
唯一特性名和属性名不一样的是class属性,它是用来指定应用于某个元素的一个CSS类,用className代替。<o:p></o:p>
<o:p> </o:p>
table方法<o:p></o:p>
元素添加了以下内容:<o:p></o:p>
caption――指向
元素的集合<o:p></o:p>tFoot ―― 指向
元素<o:p></o:p>tHead rows createTHead() createTFoot() createCaption()<o:p></o:p>
deleteTHead() deleteTFoot() deleteCaption() deleteRow(position)<o:p></o:p>
insetRow(position) <o:p></o:p>
元素添加了以下内容:<o:p></o:p>
rows ――
中所有行的集合<o:p></o:p>deleteRow(position) insertRow(position) <o:p></o:p>
元素中添加了以下内容:<o:p></o:p>
cells ――
元素中所有的单元格的集合<o:p></o:p>deleteCell(position) insertCell(position)<o:p></o:p>
遍历DOM<o:p></o:p>
NodeIterator<o:p></o:p>
Document的createNodeIterator()方法创建,接受四个参数<o:p></o:p>
Root―――从树中开始搜索的那个节点<o:p></o:p>
whatToShow------一个数值代码,代表哪些节点需要访问<o:p></o:p>
filter―――NodeFilter对象,用来决定需要忽略哪些节点<o:p></o:p>
entityReferenceExpansion-----布尔值,表示是否需要扩展实体引用。<o:p></o:p>
<o:p> </o:p>
TreeWalker<o:p></o:p>
它有NodeIterator所有的功能,并且添加了一些遍历方法:<o:p></o:p>
parentNode() firstChild() lastChild() nextSibling() previousSibling() <o:p></o:p>
<o:p> </o:p>
<o:p> </o:p>
高级DOM
<