文档对象模型
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
计算机与信息工程系
document对象
属性
属性 body
cookie domain lastModified referrer
百度文库title URL
描述 提供对 <body> 元素的直接访问。对于定义了框架集的文 档，该属性引用最外层的 <frameset>。 设置或返回与当前文档有关的所有 cookie 返回当前文档的域名 返回文档被最后修改的日期和时间 返回载入当前文档的文档的 URL 返回当前文档的标题 返回当前文档的 URL
• HTML DOM对象中，文档由document对象表 示。
计算机与信息工程系
document对象
集合对象
集合 all anchors applets forms images links
描述 提供对文档中所有 HTML 元素的访问 返回对文档中所有 Anchor 对象的引用 返回对文档中所有 Applet 对象的引用 返回对文档中所有 Form 对象引用 返回对文档中所有 Image 对象引用 返回对文档中所有 Area 和 Link 对象引用
window对象
• window对象代表了打开的浏览器窗口或者文档 中的iframe框架，可对当前浏览器窗口进行相 应的操作。window对象是全局变量、函数的所 属对象，默认在JavaScript语言中定义的变量、 函数都被附加到window对象中称为全局属性或 方法。
• JavaScript语言中定义的全局变量、函数等默 认被附加到window对象上
ame()
open()
打开一个流，以收集来自任何 document.write() 或
document.writeln() 方法的输出
write()
向文档写 HTML 表达式 或 JavaScript 代码
writeln()
等同于 write() 方法，不同的是在每个表达式之后
写一个换行符
计算机与信息工程系
计算机与信息工程系
HTML DOM的几个概念
• 根节点：处在HTML DOM树结构的顶端节点， 在HTML DOM中根节点就是html节点，HTML 文档语法不够严格，因此在HTML文档中偶尔 出现多个html根节点，但并不会影响界面效果。
• 父节点（parent）：HTML DOM是一个树形结 构，每个节点都有一个父节点，即一个节点的 上级节点，在HTML DOM中一个节点只有一个 直接父节点，如图6-1中html就是head和body 节点的父节点。
计算机与信息工程系
HTML DOM概述
• 在HTML DOM中，把所有HTML标签作为节点处理， 因此任何一个HTML标签都是DOM对象中的一个节点 元素，每个节点对象有其对应的相关属性和方法。
• 根据HTML文档结构，HTML DOM的根节点为html， 在根节点下面包括了两个节点：一个是head节点，定 义了HTML文档相关信息，不显示在界面上；另一个 是body节点，其下面的所有节点内容将会被显示在界 面上，但由于HTML语法并不严格要求，因此，body 中可以包含非显示性的节点，如link, script等。
文档对象模型（DOM）
基于HTML5的APP开发教程
计算机与信息工程系
本讲内容
• DOM概述 • HTML DOM简介 • JavaScript语言访问DOM • 与DOM相关的对象 • DOM相关事件
DOM概述
• 文档对象模型DOM（Document Object Model）是 W3C（万维网联盟）提供的标准，其定义了访问 HTML和XML的标准。其目的是将HTML和XML中的 标签对象化，并通过DOM树结构模式访问HTML元素 和XML元素及其元素属性，DOM对象中提供了大量的 访问HTML文档和XML文档以及SVG的方法和属性。 DOM提供了树形结构，提供方法以访问树，可改变树 结构、样式以及内容，同时DOM对象是一组节点和对 象组，提供了各种属性和方法，节点可附加事件处理， 最重要的是DOM对象将脚本语言与Web页面链接起来。
计算机与信息工程系
HTML DOM的几个概念
• 子节点（child）：一个节点的下一级节点，在 HTML DOM中一个节点下可以包括多个子节点， 如图6-1中head节点和body节点就是html根节 点的子节点。
• 同胞（sibling）：也称为兄弟节点，与其他节 点拥有同一个父节点的节点，称为同胞节点， 如图6-1中head节点和body节点就是互为同胞 节点。
计算机与信息工程系
document对象
方法
方法
描述
close()
关闭用 document.open() 方法打开的输出流，并显
示选定的数据
getElementById() 返回对拥有指定 id 的第一个对象的引用
getElementsByName 返回带有指定名称的对象集合
()
getElementsByTagN 返回带有指定标签名的对象集合
• 文本节点：具体的文本内容，在节点树中，称 为文本节点，文本节点不能再有子节点。
计算机与信息工程系
JavaScript访问DOM
• HTML标签元素在DOM中被称为节点对象或元 素对象，标签名称和节点名称一一对应。在移 动互联应用客户端开发中，最常用的HTML DOM节点操作是采用JavaScript脚本语言，其 操作方式是通过HTML DOM中的相关方法和属 性。HTML标签元素对应对象的名称基本是相 同的。
计算机与信息工程系
window对象
• Window对象常见方法：alert()、confirm()、 setInterval()、setTimeout()、createPopup()、 postMessage()等
• Window对象包含的常见属性：document、 fullScreen、localStorage、opener、 sessionStorage等
计算机与信息工程系
DOM概述
• W3C DOM标准被分为3个部分： • 1．核心部分，针对任何结构化文档的标准模
型； • 2．XML DOM，处理XML文档的标准模型，定
义了所有XML文档元素的对象和属性以及访问 方法； • 3．HTML DOM，处理HTML文档的标准模型， 定义了HTML文档元素的对象和属性以及访问 方法。