Dom简介

在网页上,组成页面(或文档)的对象被组织在一个树形结构中。

页面的顶级包含在<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

Dom简介的相关文章

Dom 简介

HTML DOM 简介 DOM 教程 DOM 节点 HTML DOM 定义了访问和操作 HTML 文档的标准. 您应该具备的基础知识 在您继续学习之前,您需要对以下内容拥有基本的了解: HTML CSS JavaScript 什么是 DOM? DOM 是 W3C(万维网联盟)的标准. DOM 定义了访问 HTML 和 XML 文档的标准: "W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容.结构和样式." W3C DOM 标准被分为

BOM DOM 简介

BOM和DOM简介 BOM,Browser Object Model ,浏览器对象模型. BOM主要提供了访问和操作浏览器各组件的方式. 浏览器组件:   window(浏览器窗口)   location(地址栏)   history(浏览历史)   screen(显示器屏幕)   navigator(浏览器软件)   document(网页) DOM,Document Object Model,文档对象模型. DOM主要提供了访问和操作HTML标记的方式. HTML标记:   图片标记   表

轻松学习JavaScript十八:JavaScript之DOM简介

一DOM概述 DOM(文档对象模型)是HTML和XML的应用程序接口(API).DOM将把整个页面规划成由节点层级构成的文档. DOM描绘了一个层次化的节点树,运行开发人员添加,移除和修改页面的某一部分.HTML或XML页面的每个部分都 是一个节点的衍生物.通过DOM,可访问HTML文档的所有元素.当网页被加载时,浏览器会创建页面的文档对象模 型,DOM模型被构造为对象的树. DOM是W3C(万维网联盟)的标准.DOM定义了访问HTML和XML文档的标准."W3C 文档对象模型(DOM)是中立

使用jsoup解析HTML之jsoup和HTML DOM简介

jsoup 是一款 Java 的HTML 解析器,可直接解析某个URL地址.HTML文本内容.它提供了一套非常省力的API,可通过DOM,CSS以及类似于JQuery的操作方法来取出和操作数据.类似的解析器还有HTMLParser,使用的也比较广泛,但是HTMLParser缺少维护,发布的最后一个版本还停留在2006年(http://sourceforge.net/projects/htmlparser/files/). 在使用jsoup解析html之前,有必要对html的dom结构进行一个了解

Javascript:Dom简介(查找/修改HTML元素的内容及属性)

当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model).HTML DOM 模型被构造为对象的树. 通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML.例如:改变HTML元素,改变HTML属性,改变CSS样式,事件响应. 代码整理自w3school:http://www.w3school.com.cn 效果图: 代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit

JavaScript DOM对象

DOM简介 HTML DOM:当网页被加载时,浏览器会创建页面的文档对象模型 JavaScript能够改变页面中的所有HTML元素 JavaScript能够改变页面中的所有HTML属性 JavaScript能够改变页面中的所有CSS样式 JavaScript能够改变页面中的所有事件作出反应 DOM操作HTML 改变HTML输出流 注意:绝对不要在文档加载完成之后使用document.write().这会覆盖该文档 寻找元素 通过id找到HTML元素 通过标签名找到HTML元素 改变HTML内容

前端学习系列之JavaScript DOM

JavaScript DOM简介 介绍 文件对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.DOM编程: DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准 HTML DOM节点树 通过 HTML DOM,树中的所有节点均可通过 JavaScript 进行访问.所有 HTML 元素(节点)均可被修改,也可以创建或删除节点 理解几个概念,html标签没有父辈,没有兄弟,所以html标签为根标签.head标签是htm

基础DOM和CSS操作

DOM简介 DOM是一种文档对象模型,方便开发者对HTML结构元素内容进行展示和修改.在JavaScript中,DOM不但内容庞大繁杂,而且我们开发的过程中需要考虑更多的兼容性.扩展性.在jQuery中,已经将最常用的DOM操作方法进行了有效封装,并且不需要考虑浏览器的兼容性. D表示的是页面文档Document.O表示对象,即一组含有独立特性的数据集合.M表示模型,即页面上的元素节点和文本节点. DOM有三种形式,标准DOM.HTML DOM.CSS DOM(难道不是XML DOM吗?),大部

JS之DOM编程

为什么学dom编程? 通过dom编程,我们可以写出各种网页游戏 dom编程也是我们学习ajax技术的基础,所以我们必需掌握好dom编程.  dom编程简介 DOM=Document Object Model(文档对象模型),根据W3C DOM规范,DOM是HTML与XML的应用编程接口(API),DOM将整个页面映射为一个由层次节点组成的文件. js把浏览器,网页文档和网页文档中的html元素都用相应的内置对象来表示,这些对象与对象间的层次关系称为dom,针对网页(html,jsp,php,as