在网页上,组成页面(或文档)的对象被组织在一个树形结构中。
页面的顶级包含在<html>标签中,在其中会找到<head>和<body>标签,而其它标签包含在这两个标签中,依次类推。
javascript将文档树中的每一项都当做对象,可以使用javascript操纵这些对象。用来表示文档中对象的标准模型就称为DOM(Document Object Model)。
<html> <head> <title>Dom</title> </head> <body> <form id="form1" action="#"> <input type="button" id="b1" value="AddContent"> </form> <form id="form2" action="#"> <input type="button" id="b2" value="AddContent"> </form> </body> </html>
Document 对象集合
集 合 | 描 述 |
all[] | 提供对文档中所有 HTML 元素的访问。 |
anchors[] | 返回对文档中所有 Anchor 对象的引用。 |
applets | 返回对文档中所有 Applet 对象的引用。 |
forms[] | 返回对文档中所有 Form 对象引用。 |
images[] | 返回对文档中所有 Image 对象引用。 |
links[] | 返回对文档中所有 Area 和 Link 对象引用。 |
var doc = document.forms; document.write(doc.length);
获取页面上所有的form表单的数组将表单数组的长度写在页面上,为2
Document 对象属性
属 性 | 描 述 |
body |
提供对 <body> 元素的直接访问。 对于定义了框架集的文档,该属性引用最外层的 <frameset>。 |
cookie | 设置或返回与当前文档有关的所有 cookie。 |
domain | 返回当前文档的域名。 |
lastModified | 返回文档被最后修改的日期和时间。 |
referrer | 返回载入当前文档的文档的 URL。 |
title | 返回当前文档的标题。 |
URL | 返回当前文档的 URL。 |
var expireDate = new Date(); expireDate.setMonth(expireDate.getMonth()+6); var userName = document.getElementById("nameField").value; document.cookie = "userName=" + userName + ";expires=" + expireDate.toGMTString();
设置浏览器cookie
Document 对象方法
方 法 | 描 述 |
close() | 关闭用 document.open() 方法打开的输出流,并显示选定的数据。 |
getElementById() | 返回对拥有指定 id 的第一个对象的引用。 |
getElementsByName() | 返回带有指定名称的对象集合。 |
getElementsByTagName() | 返回带有指定标签名的对象集合。 |
open() | 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。 |
write() | 向文档写 HTML 表达式 或 JavaScript 代码。 |
writeln() | 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。 |
document.getElementById("days")
取id为days的HTML对象
备注:上面几个方法中,访问页面元素常用的有getElementById,getElementsByName 和 getElementsByTagName。
其中
getElementById 返回的为单对象;getElementsByName为根据name获取到的元素的集合,getElementsByTagName
为根据tag名称获取到的元素的集合。
时间: 2024-10-13 11:48:08