Document对象详解
IE的document对象属性
getElementsByTagName 获取基于指定元素名称的对象集合。
hasFocus 获取表明对象目前是否拥有焦点的值。
mergeAttributes 复制所有读/写标签属性到指定元素。
open 此方法以两种方式工作。该方法打开一个文档用于收集 write 和 writeln 方法的输出。在这种情况下，只使用前两个参数 url 和 name。若指定了附加参数，此方法将打开一个窗口，这与 window 对象的 window.open 方法相同。
setActive 设置对象为当前对象而不将对象置为焦点。
write 在指定窗口的文档中写入一个或多个 HTML 表达式。
writeln 在指定窗口的文档中写入一个或多个 HTML 表达式，后面追加一个换行符。
document对象 - 对象
元素 对象 描述
BODY body 指定文档主体的开始和结束。
expando 设置或获取表明是否可对象内创建任意变量的值。
fgColor 设置或e 获取文件创建的日期。
fileModifiedDate 获取文件上次修改的日期。
fileSize 获取文件大小。
implementation 获取当前文档的 implementation 对象。
document对象 - 注释
此对象在 Microsoft? Internet Explorer 3.0 的脚本中可用。
使用 document 对象可以对 HTML 文档进行检查、修改或添加内容，并处理该文档内部的事件。在 Web 页面上，document 对象可通过 window 对象的 document 属性引用，或者直接引用。
document 对象_方法
document 对象_方法document 对象是 HTML 文档的根对象，它提供了许多方法来访问和操作文档的内容。
1. document.write() 方法document.write() 方法用于向文档中写入 HTML 代码。
它可以用来创建文档的结构，添加文本、图像、链接等元素。
html<!DOCTYPE html><html><head><title>Document Write Example</title></head><body><h1>Hello World!</h1><script>document.write("<p>This is a paragraph.</p>");</script></body></html>输出结果：html<!DOCTYPE html><html><head><title>Document Write Example</title></head><body><h1>Hello World!</h1><p>This is a paragraph.</p></body></html>2. document.getElementById() 方法document.getElementById() 方法用于根据ID 属性获取文档中的元素。
它返回一个指向该元素的引用，以便我们可以对其进行操作。
html<!DOCTYPE html><html><head><title>Get Element by ID Example</title></head><body><h1 id="heading">Hello World!</h1><script>var heading = document.getElementById("heading");heading.style.color = "red";</script></body></html>输出结果：html<!DOCTYPE html><html><head><title>Get Element by ID Example</title></head><body><h1 id="heading" style="color: red;">Hello World!</h1></body></html>3. document.getElementsByTagName() 方法document.getElementsByTagName() 方法用于根据标签名获取文档中的元素。
Document文档对象
JavaScript中的Document文档对象Document文档对象是JavaScript中window和frames对象的一个属性,是显示于窗口或框架内的一个文档。
描述当前窗口或指定窗口对象的文档。
它包含了文档从<head>到</body>的内容。
用法：document （当前窗口）或<窗口对象>.document （指定窗口）属性：∙document.title //设置文档标题等价于HTML的<title>标签∙document.bgColor //设置页面背景色∙document.fgColor //设置前景色(文本颜色)∙document.linkColor //未点击过的链接颜色∙document.alinkColor //激活链接(焦点在此链接上)的颜色∙document.vlinkColor //已点击过的链接颜色∙document.URL //设置URL属性从而在同一窗口打开另一网页∙document.fileCreatedDate //文件建立日期，只读属性∙document.fileModifiedDate //文件修改日期，只读属性∙document.fileSize //文件大小，只读属性∙document.cookie //设置和读出cookie∙document.charset //设置字符集简体中文:gb2312∙cookie 关于cookie 请参看“使用框架和Cookies”一章。
∙lastModified 当前文档的最后修改日期，是一个Date 对象。
∙referrer 如果当前文档是通过点击连接打开的，则referrer 返回原来的URL。
∙title 指<head>标记里用<title>...</title>定义的文字。
在Netscape 里本属性不接受赋值。
∙fgColor 指<body>标记的text 属性所表示的文本颜色。
JAVASCRIPTDOCUMENT对象属性和方法
JAVASCRIPTDOCUMENT对象属性和方法JavaScript的Document对象是用于对HTML文档进行访问和操作的核心对象。
它提供了一系列属性和方法，用于获取、设置和操作文档的各个部分，包括元素、样式、事件等。
下面将介绍一些Document对象的常用属性和方法。
一、属性：1. document.documentElement：返回文档中的根元素，即<html>元素。
2. document.body：返回文档中的<body>元素。
3. document.head：返回文档中的<head>元素。
4. document.title：获取或设置文档的标题。
5. document.URL：获取当前文档的URL。
6. document.domain：获取或设置当前文档的域名。
7. document.forms：返回文档中所有的<form>元素，以HTMLCollection对象的形式返回。
8. document.links：返回文档中所有的<a>元素，以HTMLCollection对象的形式返回。
9. document.images：返回文档中所有的<img>元素，以HTMLCollection对象的形式返回。
10. document.scripts：返回文档中所有的<script>元素，以HTMLCollection对象的形式返回。
11. document.defaultView：返回当前文档关联的窗口对象。
12. document.styleSheets：返回文档中所有的样式表，以StyleSheetList对象的形式返回。
13. document.activeElement：返回当前文档中获得焦点的元素。
二、常用方法：1. document.getElementById(id)：根据元素id查找并返回第一个匹配的元素。
document用法js
document用法js在JavaScript中，document对象是Web应用程序与浏览器交互的主要接口。
它代表了浏览器窗口中可见的文档，提供了许多属性和方法，用于处理文档的加载、显示、交互和修改等操作。
下面将详细介绍document对象的用法。
一、基本含义document对象表示浏览器窗口中当前的HTML文档。
它是一个全局对象，可以在JavaScript代码中的任何地方访问。
二、属性和方法1.属性(1)文档内容：document.documentElement属性返回文档的根元素（即<html>元素）。
(2)文档URL：document.URL属性返回当前文档的URL。
(3)文档标题：document.title属性返回当前文档的标题。
(4)文档类型：document.doctype属性返回文档类型声明对象（如果存在）。
2.方法(1)加载和显示文档：document.open()方法用于打开一个新的文档或清空现有文档的内容，以便于新的内容可以写入其中。
document.write()方法用于向文档中写入内容。
这两个方法通常一起使用，以加载并显示HTML文档。
(2)创建新元素：document.createElement()方法用于创建一个新的HTML元素，并将其添加到文档中。
(3)修改元素内容：document.getElementById()、document.getElementsByClassName()和document.getElementsByTagName()方法可用于获取文档中的元素，并对其进行操作，如修改其内容和属性。
(4)事件处理：document对象可以监听各种浏览器事件，如点击、鼠标移动、键盘输入等，并相应地执行回调函数。
常用的事件处理方法包括addEventListener()和removeEventListener()。
三、常见用法示例1.加载和显示HTML文档：```javascriptdocument.open();//打开新的文档或清空现有文档内容document.write('<html><head><title>MyTitle</title></head> <body>HelloWorld!</body></html>');//写入内容document.close();//关闭文档```2.创建新元素并添加到文档中：```javascriptvarp=document.createElement('p');//创建新的<p>元素p.textContent='Thisisanewparagraph.';//设置内容document.body.appendChild(p);//将<p>元素添加到<body>元素中```3.使用getElementById获取元素并进行操作：```javascriptvarmyElement=document.getElementById('myId');//获取具有指定ID的元素myElement.style.color='red';//修改元素的字体颜色为红色```4.事件处理示例：```javascriptdocument.getElementById('myButton').addEventListener('cli ck',function(){alert('Buttonwasclicked.');//当按钮被点击时显示警告框});```以上是document对象的一些常用属性和方法，通过这些方法可以方便地操作和处理HTML文档。
第18讲 document对象
document对象
•
• • • <Head> <Title> • • • <Center> <H1>
<Html>
• Body • • <Table> <tr> • • • • • • • • <td> 文字：姓名 <td> 文字：年龄 <td> 文字：性别 <td> 文字：班级
文字：学生信息表
文字：学生信息表
10
JavaScript应用程序设计
主讲：李冀明
Version 1.0
document对象
文件对象(Document)代表当前的HTML对象， 是由<BODY>标记组构成的，JavaScript自动 为每一个HTML文件建立一个document对象， 用来显示HTML文件。
2
document对象
• 我 们 这 里 只 对 DOM 做 一 个 介 绍 。 DOM 是 “Document Object Model”（文档对象模型） 的首字母缩写，是 HTML 和 XML 的应用程序 接口（API）。DOM 将把整个页面规划成由 节点层级构成的文档。HTML 或 XML 页面的 每个部分都是一个节点的衍生物。
9
document对象
• 在DOM结构里面，每一个HTML元素都可以称为一个节点（node），节 点的上一层被称为它的父节点，但文字内容是不作为节点存在的，文 字内容是属于通过节点可以取得的值，比如在上图（图4-1-2-1）里面， 可以看到，最下层的节点为<td>、<h1>、<title>，最顶层的节点则为根 节点，也就是<html>，每一层节点都可以作为其下属节点的父节点。 <html>下属有两个节点<head>、<body>，那么就可以说节点<head>、 <body>是父节点<html>的2个子节点，而节点<head>、<body>由于有同 一个父节点，那么这两个节点可以称为兄弟节点。最下层的文字层 （比如上面的“姓名、性别”这样的文字）一般不作为节点处理，但 是也可以将其称为叶子节点，除开最底层的叶子节点以及最顶层的根 节点外，其余的每个中间节点都至少有一个父节点，一个或多个子节 点。比如上图的<td>节点本来是最底层的子节点，但如果在其中加上 <input></input>节点，则<td>节点就成为了<input></input>节点的父节点， <input></input>就成为最下层子节点，以此类推。通俗的说，我们可以 把HTML结构想象为一颗倒起来的树，它的树干就是根节点，分出树枝 的地方就是子节点，每一根树枝都有可能分岔，这样分岔的树枝就是 新生树枝的父节点，最外层的树叶就是叶子节点。所以我们把这样的 结构叫做树形结构。
JS中document对象详解
JS中document对象详解JS中document对象详解对象属性document.title //设置⽂档标题等价于HTML的<title>标签document.bgColor //设置页⾯背景⾊document.fgColor //设置前景⾊(⽂本颜⾊)document.linkColor //未点击过的链接颜⾊document.alinkColor //激活链接(焦点在此链接上)的颜⾊document.vlinkColor //已点击过的链接颜⾊document.URL //设置URL属性从⽽在同⼀窗⼝打开另⼀⽹页document.fileCreatedDate //⽂件建⽴⽇期，只读属性document.fileModifiedDate //⽂件修改⽇期，只读属性document.fileSize //⽂件⼤⼩，只读属性document.cookie //设置和读出cookiedocument.charset //设置字符集简体中⽂:gb2312---------------------------------------------------------------------对象⽅法document.write() //动态向页⾯写⼊内容document.createElement(Tag) //创建⼀个html标签对象document.getElementById(ID) //获得指定ID值的对象document.getElementsByName(Name) //获得指定Name值的对象document.body.appendChild(oTag)---------------------------------------------------------------------body-主体⼦对象document.body //指定⽂档主体的开始和结束等价于<body></body>document.body.bgColor //设置或获取对象后⾯的背景颜⾊document.body.link //未点击过的链接颜⾊document.body.alink //激活链接(焦点在此链接上)的颜⾊document.body.vlink //已点击过的链接颜⾊document.body.text //⽂本⾊document.body.innerText //设置<body>...</body>之间的⽂本document.body.innerHTML //设置<body>...</body>之间的HTML代码document.body.topMargin //页⾯上边距document.body.leftMargin //页⾯左边距document.body.rightMargin //页⾯右边距document.body.bottomMargin //页⾯下边距document.body.background //背景图⽚document.body.appendChild(oTag) //动态⽣成⼀个HTML对象----------------------------常⽤对象事件:document.body.onclick="func()" //⿏标指针单击对象是触发document.body.onmouseover="func()" //⿏标指针移到对象时触发document.body.onmouseout="func()" //⿏标指针移出对象时触发document.body.innerHTML='＜br/＞＜br/＞＜br/＞This is not at the bottom!＜br/＞"+document.body.innerHTML; <body>test<script>function dothis() {alert('done!');}</script><script>document.body.onclick = dothis();</script></body><SCRIPT LANGUAGE="JavaScript">for(a in document.body){document.write(a);document.write("----");document.write(document.body[a]);document.write("<br>");}</SCRIPT>var br = document.createElement("br");document.body.appendChild(br); ======================================================================location:document.location.hash // #号后的部分 VS window.location.hashdocument.location.host // 域名+端⼝号document.location.hostname // 域名document.location.href // 完整URLdocument.location.pathname // ⽬录部分(应⽤程序)document.location.port // 端⼝号document.location.protocol // ⽹络协议(http:)document.location.search // ?号后的部分----------------------------常⽤对象事件:documeny.location.reload() //刷新⽹页document.location.reload(URL) //打开新的⽹页document.location.assign(URL) //打开新的⽹页document.location.replace(URL) //打开新的⽹页URL即:统⼀资源定位符 (Uniform Resource Locator, URL)完整的URL由这⼏个部分构成：scheme://host:port/path?query#fragmentscheme:通信协议常⽤的http,ftp,maito等host:主机服务器(计算机)域名系统 (DNS) 主机名或 IP 地址。
document的用法和搭配
document的用法和搭配一、什么是document？Document对象是HTML文档的根节点，在JavaScript中，它代表整个文档，是操作HTML元素的入口。
二、document的常用属性1. document.title：获取或设置文档标题。
2. document.URL：获取当前文档的URL。
3. document.domain：获取或设置文档域名。
4. document.referrer：获取当前文档的引用页面。
5. document.body：获取或设置文档主体部分。
三、document的常用方法1. getElementById()：根据元素ID获取元素对象。
2. getElementsByTagName()：根据标签名获取元素对象集合。
3. getElementsByClassName()：根据类名获取元素对象集合。
4. querySelector()：返回匹配指定CSS选择器的第一个元素对象。
5. querySelectorAll()：返回匹配指定CSS选择器的所有元素对象集合。
四、document与DOM操作1. 创建新节点：```var newElement = document.createElement('div');```2. 添加子节点：```var parentElement = document.getElementById('parent'); parentElement.appendChild(newElement);```3. 删除子节点：```var parentElement = document.getElementById('parent'); var childElement = document.getElementById('child'); parentElement.removeChild(childElement);4. 替换子节点：```var parentElement = document.getElementById('parent'); var oldChild = parentElement.childNodes[0];var newChild = document.createElement('div'); parentElement.replaceChild(newChild, oldChild);```五、事件监听1. addEventListener()方法：```element.addEventListener(event, function, useCapture);```2. removeEventListener()方法：```element.removeEventListener(event, function, useCapture);六、document对象与表单操作1. 获取表单元素：```var form = document.forms[0];var input = form.elements['inputName']; ```2. 提交表单：```form.submit();```3. 重置表单：```form.reset();```七、常见问题1. 如何获取页面中所有的链接？可以使用getElementsByTagName()方法获取所有的<a>标签，然后遍历集合，获取href属性值。
Word_Document 对象
GoTo'返回一个 Range 对象，该对象代表指定项（如页、书签或域）的起始位置。
LockServerFile'在服务器上锁定文件，以避免任何其他人进行编辑。
Undo'撤消最后一次操作或最后一系列操作，这些操作显示在“撤消”列表中。如果撤消操作成功，则返回 True。
UndoClear'清除可对指定文档撤消的操作列表。
Unprotect'清除对指定文档的保护。
UpdateStyles'将所有样式从附加模板复制到文档中，同时覆盖文档中所有现有同名的样式。
SelectContentControlsByTag'返回一个 ContentControls 集合，该集合代表文档中具有 Tag 参数中指定标记值的所有内容控件。只读。
SelectContentControlsByTitle'返回一个 ContentControls 集合，该集合代表文档中具有 Title 参数中指定标题的所有内容控件。只读。
DeleteAllComments'删除文档中 Comments 集合内的所有备注。
DeleteAllCommentsShown'删除显示在屏幕上的指定文档的所有修订。
DeleteAllEditableRanges'删除（指定用户或用户组有权修改其权限的）所有区域中的权限。
DeleteAllInkAnnotations'删除文档中所有手写墨迹注释。
AutoFormat'自动给文档套用格式。
document.用法
document.用法
"document" 是指在网页编程中用来表示整个 HTML 文档的对象。
它是 JavaScript 中的一个内置对象，常用于访问和操作网页中的
元素和内容。
首先，我们可以使用 document 对象来访问和操作 HTML 元素。
比如，我们可以使用 document.getElementById() 方法通过元素的ID 来获取特定的元素，然后对其进行操作，比如改变其内容、样式
或者其他属性。
另外，document 对象也可以用来创建新的 HTML 元素，比如使
用 document.createElement() 方法可以创建一个新的元素节点，
然后可以通过其他方法将其添加到网页中。
除此之外，document 对象还可以用来操作整个文档的结构，比
如可以使用 document.write() 方法在文档中写入内容，或者使用document.getElementById() 方法来获取整个文档中的某个特定的
元素。
总之，document 对象在网页编程中起着非常重要的作用，它提
供了丰富的方法和属性，可以让开发者轻松地操作和控制整个 HTML 文档的内容和结构。
希望这些信息能够帮助你更好地理解 document 对象的用法。
JAVASCRIPTDOCUMENT对象属性和方法
JAVASCRIPTDOCUMENT对象属性和方法Document 对象是 JavaScript 中代表浏览器中当前网页文档的对象，它提供了许多属性和方法来操作和访问文档的各个部分。
在 JavaScript 中，可以通过 `document` 对象来访问文档的各个元素、属性和方法。
以下是一些常用的 `document` 对象的属性和方法：1. `document.title` - 获取或设置当前文档的标题。
例：```javascriptconsole.log(document.title); // 输出当前文档的标题document.title = "新标题"; // 设置当前文档的标题```2. `document.URL` - 获取当前文档的 URL 地址。
例：```javascriptconsole.log(document.URL); // 输出当前文档的 URL 地址```3. `document.domain` - 获取或设置当前文档的域名。
例：```javascriptconsole.log(document.domain); // 输出当前文档的域名```4. `document.head` - 获取 `<head>` 元素。
例：```javascriptconsole.log(document.head); // 输出 <head> 元素```5. `document.body` - 获取 `<body>` 元素。
例：```javascriptconsole.log(document.body); // 输出 <body> 元素```6. `document.cookie` - 获取或设置当前文档的 cookie。
例：```javascriptconsole.log(document.cookie); // 输出当前文档的 cookiedocument.cookie = "name=value"; // 设置当前文档的 cookie```7. `document.getElementById(id)` - 根据元素的 id 获取元素。
js中Document对象
js中Document对象JavaScript 语法是⼀套规则，它定义了 JavaScript 的语⾔结构。
JavaScript 语句定义两种类型的值：混合值和变量值。
混合值被称为字⾯量（literal）。
变量值被称为变量。
在编程语⾔中，变量⽤于存储数据值。
JavaScript 使⽤ var 关键词来声明变量。
window.onload 页⾯加载完成⽤法⼀，window.onload的⽤法：因为页⾯中的代码⼀般情况下按照，从上到下，从左到右的顺序执⾏。
所以当js代码需要获取页⾯中的元素时，如果script标签在元素的前⾯，需要加window.onload；如果script放在了元素后⾯，就不需要加window.onload。
⼆，问题解决把JavaScript中要执⾏的程序放在window.οnlοad=function(){}中⼀、Document对象1、什么是Document对象？DOM(Document Object Model,⽂档对象模型)定义了访问和操作HTML⽂档的标准⽅法。
它把HTML⽂档表现为带有元素、属性和⽂本的树结构（节点树），如下图所⽰：⽂档对象:代表浏览器窗⼝中的⽂档，每个载⼊浏览器的HTML⽂档都会成为Document对象。
作⽤：访问HTML⽂档中包含的任何HTML标记并可动态地改变HTML标记中的内容。
如下图所⽰：提⽰：Document对象是Window对象的⼦对象，可通过window.document属性对其进⾏访问。
2、Document 对象的属性和⽅法Document 对象集合Document 对象描述HTMLDocument接⼝对DOM Document接⼝进⾏了扩展，定义HTML专⽤的属性和⽅法。
很多属性和⽅法都是 HTMLCollection对象（实际上是可以⽤数组或名称索引的只读数组），其中保存了对锚、表单、链接以及其他可脚本元素的引⽤。
这些集合属性都源⾃于0级DOM。
document.用法 -回复
document.用法-回复文章主题：[document.用法]导言：在计算机编程和网页开发中，我们经常会听到document一词。
它是一种很重要的对象，用于表示整个HTML文档的内容，并且可以进行各种操作。
本文将逐步介绍document对象的用法和功能，帮助读者更好地理解和运用此对象。
第一部分：什么是document对象？1.1 document对象的定义和作用document对象是指代表示整个HTML文档的对象，可以通过它来访问和操作文档中的元素、属性和方法。
1.2 document对象的创建在浏览器中打开HTML文档后，浏览器会自动创建一个document对象，它与当前打开的文档关联起来。
我们可以使用JavaScript代码来获取这个对象，以便进行后续的操作。
第二部分：document对象的常用属性和方法2.1 常用属性2.1.1 document.documentElement该属性返回文档的根元素（HTML元素），一般是<html>标签。
通过该属性，我们可以方便地对整个文档进行操作，如修改样式、添加新元素等。
2.1.2 document.title该属性用于设置或获取当前文档的标题。
我们可以通过修改这个属性来改变页面的标题，从而提升用户体验。
2.1.3 document.URL该属性返回当前页面的完整URL地址。
这对于需要获取当前页面的地址的应用程序非常有用，如打开特定链接、生成二维码等。
2.1.4 document.cookie该属性用于操作和获取当前文档的Cookie信息。
Cookie是一种在浏览器和Web服务器之间传递信息的机制，通过使用document.cookie属性，我们可以读取、写入、修改和删除Cookie。
2.2 常用方法2.2.1 document.getElementById()这是一个用于获取指定ID的元素的方法。
通过指定元素的ID，我们可以直接获取到该元素的引用，并对其进行进一步的操作。
js里的document对象大全（DOM操作）
js⾥的document对象⼤全（DOM操作）什么是DOMdocument object model 的简称，意思为⽂档对象模型。
主要⽤来对⽂档中的html节点进⾏操作。
Dom的操作简单⽰例：<div id="t1"><div><input type="file"/><input type="button" value="删除" onclick="del(this)"/></div></div><input type="button" value="增加" onClick="add()"/><script>function add(){var t1 = document.getElementById('t1');//获取节点var div = document.createElement('div');//创建divvar file = document.createElement('input');//创建inputfile.setAttribute('type','file');//设置input的类型为filevar btn = document.createElement('input');//创建inputbtn.setAttribute('type','button');//设置input的类型为buttonbtn.setAttribute('value','删除');//设置input的value为删除btn.setAttribute('onclick','del(this)');//设置onclick事件div.appendChild(file);//把file添加到div中div.appendChild(btn);//把btn添加到div中t1.appendChild(div);//把div添加到t1中}function del(_this){var div = _this.parentNode;var t1 = _this.parentNode.parentNode;t1.removeChild(div);}</script>Dom对象的属性与⽅法返回对象集合：(1).all[];(2).images[];(3).anchors[];(4).forms[];(5).links[];属性：document.cookie;设置或返回当前⽂档有关的所有cookiedocument.title;返回当前⽂档的标题document.domain；返回当前⽂档的域名document.URL;返回当前⽂档的URL元素属性及⽅法getElementById(''); 返回指定 Id 的第⼀个对象。
js中document对象方法
js中document对象方法document对象是JavaScript中的一个重要对象，它代表了整个HTML文档。
通过document对象，我们可以对文档进行各种操作，包括获取元素、修改元素、添加元素等。
本文将介绍document对象的一些常用方法。
一、获取元素1. getElementById()：通过元素的id属性获取元素。
该方法返回一个元素对象，如果找不到对应的元素，则返回null。
2. getElementsByTagName()：通过元素的标签名获取元素。
该方法返回一个HTMLCollection对象，包含所有符合条件的元素。
3. getElementsByClassName()：通过元素的类名获取元素。
该方法返回一个HTMLCollection对象，包含所有具有指定类名的元素。
4. querySelector()：通过CSS选择器获取元素。
该方法返回第一个符合条件的元素。
5. querySelectorAll()：通过CSS选择器获取元素。
该方法返回所有符合条件的元素。
二、修改元素1. innerHTML：获取或设置元素的HTML内容。
可以通过该属性来修改元素的内容。
2. innerText：获取或设置元素的文本内容。
与innerHTML类似，但只能操作纯文本内容。
3. style：获取或设置元素的样式。
可以通过该属性来修改元素的外观。
4. className：获取或设置元素的类名。
可以通过该属性来添加或删除元素的类。
5.setAttribute()：设置元素的属性。
可以通过该方法来添加或修改元素的属性。
三、添加元素1. createElement()：创建一个新的元素。
可以通过该方法创建新的元素节点。
2. appendChild()：将一个元素添加到另一个元素的子节点列表末尾。
3. insertBefore()：将一个元素插入到另一个元素之前。
四、其他常用方法1. addEventListener()：为元素添加事件监听器。
dom对象详解--document对象（三）
dom对象详解--document对象（三）form对象form对象代表⼀个HTML表单，在HTML⽂档中<form>每出现⼀次，form对象就会被创建。
从dom对象层次图看，document.forms对象是当前⽂档所有form对象的集合。
例，<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document</title><script type="text/javascript">function test() {//如何取得所有的表单var allforms = document.forms;//window.alert(allforms.length);//可以通过allforms去访问指定表单window.alert(allforms[0].username.value);//window.alert(allforms[1].hobby2.value);//window.alert(allforms.item(1).hobby2.value);}</script></head><body><h1>个⼈信息</h1><form action="">u:<input type="text" name="username"/><br/>p:<input type="password" name="pwd"/><br/><input type="submit" value="提交"/></form><h1>兴趣爱好</h1><form action="">爱好1:<input type="text" name="hobby1"/><br/>爱好2:<input type="text" name="hobby2"/><br/><input type="submit" value="提交"/></form><input type="button" value="测试" onclick="test()"/></body></html>案例：⽤户注册。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第一章 文档中的对象
• 使用Document对象可以访问文档中的对象， 文档中的对象包括HTML元素，超链接，锚 点和图像等。
1.1 HTML元素
• 在javascript中，为Document对象定义了all 属性来访问文档中的所有HTML元素对象。 • 通过Document对象使用all属性，得到文档 中的所有HTML元素对象组成的数组。因此 所有对数组的操作都可以应用在all属性的 结果。
第四章 文档事件
• 在文档中有两个非常重要的事件，那就是鼠标事 件和键盘事件。在鼠标事件和键盘事件中又有很 多更加具体的事件。在前面的学习中已经知道， 可以使用对象来调用它们，也可以将事件放在 body标记中，这些对前面学过的事件是可行的。 • 但是对于鼠标事件和键盘事件来说不可以了，因 为这与浏览器有关。在ie浏览器中，只能把事件 放在body标记中；在NN浏览器中，只能把事件通 过对象来调用。
1.5表单
• 在javascript中，为document对象定义了forms属 性来对文档中的表单进行操作，同样使用forms属 性可以得打文档中所有表单的数组，使用数组的 length属性可以得到表单的个数，使用数组小标 来得到特定的表单。 • 在实际应用中，通常都会为每个表单定义名称， 所以都会使用表单名称来得到指定的表单。除了 使用表单名称作为数组的索引外，还可以直接使 用名称作为属性来使用，其基本形式为： • Document.formname
2.3 文档标题
• 在javascript中，为Document对象定义了 title属性来获得文档的标题。文档标题是文 档中一个很小的知识点，在HTMl文件中 TITLE标记对中的就是文档的标题。前面已 经讲到过，TITLE标记可以省略，但是文档 的标题任然存在，知识为空。
第三章 对文档的操作
第二章 文档中的内容
• 在上一节中，对文档中的对象进行了详细 的讲解。在本节中就来对文档中的一些内 容进行详细的讲解，这些内容是相对独立 的，但是它们在特定的情况下市非常重要 的。
2.1上次修改时间
• 在javascript中，为document对象定义了lastModified属性， 使用该属性可以得到当前文档最后一次被修改的具体日期 和时间。本地计算机上的每个文件都有最后修改的时间， 所以在服务器上的文档也有最后修改的时间。当客户端能 够访问服务器端的该文档时，客户端就可以使用 lastModified属性来得到该文档最后修改时间。 • 需要注意的是，由于该信息来自服务器，而这又和服务器 的设置有关，所以有可能是得不到正确的数据。 • 在运行结果中可以看，使用lastModified属性得到的日期 和时间并不是一个Date对象，而是一个字符串。这里显示 的日期和时间的格式是固定的，要想得到自己想要的日期 和时间格式，就需要使用先前讲过的Date对象的知识。
2.2文档定位
• • • • • • • • • • • • • • • • • • • • • 代码： "> <html xmlns="/1999/xhtml"> <head> <title> 文档定位</title> </head> <body> <h1>文档定位</h1> <script language="javascript" type="text/javascript"> <!-var sstring = document.location; document.write("<h3>使用location属性得到的URL为："); document.write(sstring); document.location="/"; //--> </script>
1.2锚点和超链接
• 在javascript中，为document对象定义了anchors属性来表 示文档中所有锚点的数组，还定义了links属性来表示文档 中所有超链接的数组。在对这些文档对象数组进行操作时， 可以使用以前学过的数组知识。如数组的length属性来求 数组的长度。 • 运行结果中的两个文字超链接的颜色可以不同。在文档中 可能有三种颜色活动的超链接颜色，（alinkcolor） 、未 访问的超链接颜色（linkcolor）和已经访问的超链接颜色 （vlinkcolor)。 • 不但可以通过这些属性来获得不同状态下超链接的颜色， 还可以使用这些属性来设置不同状态下超链接的颜色。
• 在上面的两节中分贝对文档中的对象和文 档的内容进行了讲解，在本节诶中就来对 文档的操作进行一下讲解。
3.1向文档进行输入
• 在javascript中，为Document对象定义了两个方法来向文 档中输入字符串，他们分别为write方法和writeln方法。期 中write方法已经被使用过无数次了，writeln方法和write方 法的不同在于输入的结果后面是否有一个换行符。但是由 于HTML中只使用<br>标记来换行，所以显示当前文档时， write方法和writeln方法没有什么区别。 • 在前面使用write方法向文档中输入内容时，如果同时具有 字符串和非字符串内容，通常会使用+号运算符来连接起 来。其实不需要这样，write方法还具有多参数的形式，可 以将每个内容作为一个参数，参数之间用逗号分隔，再向 文档输入时，就会依次输入。 • 再向文档输入字符串时，也可以在其中加入一些HTML标 记，如程序中的<h3>标记。在文档中显示时，是不会显 示这些标记的，他们会在文档中起到自身的作用。
1.3背景和文本
• 在javascript中，为document对象定义了 bgColor属性来设置背景颜色，还定义了 fgColor属性来设置文本颜色。
1.4图像
• 在javascript中，为document对象定义了images 属性来对文档中的图像进行操作。Images属性得 到的是文档中图像数组，同样也是能够通过数组 的length属性来获得文档中图像的数量，使用数 组小标可以获得每个图像。在对图像进行操作时， 如果图像定义了名称，还可以使用名称索引得到 该图像。 • 和其他对象不同的是，当文档中没有图像时，使 用images属性也能得到一个数组，其数组的长度 为0 ，因此使用images属性后还可以作为布尔值 进行使用。
1.1 HTML元素
• Document对象的all属性的结果数组不但可 以通过使用数组下标来得到HTML元素对象， 还可以直接使用HTML元素对象名称来得到 HTML元素对象。这样使用的前提是，在 HTML元素中必须有name属性来为HTML元 素对象命名。
1.1 HTML元素
• 在javascript中还为Document对象的all属性提供 了两个方法，来得到更加具体的HTML元素的对 象，这两种方法分别是item方法和tags方法。 • Item方法可以通过HTML元素对象的名称或ID来 Item HTML ID 得到HTML元素对象，他的特殊之处在于可以得 到相同对象名或者ID的所有HTML元素对象，这 些对象组成一个数组。 • 和item方法相对的是tags方法，tags方法是通过 指定的标记来得到文档中有多少该标记对象。
3.3 清除文档
• 在javascript中，为Document对象定义了 clear方法。使用clear方法可以清除文档中 的内容，但是在大量的实际应用中发现， 使用clear方法并不能完全起到该作用，而 且使用clear方法很不安全，有可能造成浏 览器的损坏。所以在实际开发中，不在使 用clear方法。当想要清除文档中的内容时， 通常使用打开和关闭文档，再向文档中输 入时，不输入任何的内容，从而删除文档 中的内容。
4.2 键盘事件
• 与鼠标事件相同的是，键盘事件也分为很多更加具体的事 件。首先看下onkeydown事件和onkeyup事件， onkeydown事件表示键盘按下事件，onkeyup事件表示键 盘弹起事件。Onkeydown事件和onkeyup事件的使用和 onmousedown事件和onmouseup事件的使用非常相似。 • 键盘事件除了onkeydown事件和onkeyup事件外，还有一 个onkeypress事件。Onkeypress事件表示整个的按键过 程。在实际应用中，通常使用onkeypress事件来获取所按 得是哪一个键。在不同的浏览器中，使用onkeypress事件 来获取按键的程序是不同的。
4.1 鼠标事件
• 根据鼠标操作的不同，鼠标事件又分为很多更农 家具体的事件。最长用的鼠标操作就是单机和双 击。在javascript中，使用onclick事件来表示鼠标 单机事件，使用ondbclick事件来代表鼠标双击事 件。 • 鼠标单机事件和鼠标双击事件不但可以定义在按 钮上，还可以定义在很多对象上，包括直接定义 在文档中。不管定义在什么地方，都是不能同时 定义onclick和ondbclick事件的，因为当双击时， 按第一下鼠标就会发生鼠标机事件。
2.2 文档定位
• 文档定位就是设置和获取文档的位置，文档的位置也可以 说是文档的URL。在javascript中，为Document对象定义 了location、URL、referrer这3个属性来对文档的位置进 行操作。 • location属性和URL属性很相似，他们都具有获取文档位 置的功能。 • 从运行结果中可以看出，使用location属性和URL属性都 可以得到文档的位置。但是它们的表示形式不同，使用 URL属性得到的是真实显示的URL，而location属性得到 的URL中将空格等特殊字符转换成码值的形式来显示，这 样更容易在网络中传输。 • 使用location属性不但可以获取文档的URL，还可以对文 档的URL进行设置。
Document对象详解