005_01文档对象模型DOM

  DOM:document object model  文档对象模型。是W3C织制订的一套用于访问XML和HTML文档的标准。允许脚本动态地访问和更新文档的内容、结构和样式。

  W3C DOM 标准被分为 3 个不同的部分:

    核心 DOM - 针对任何结构化文档的标准模型

    XML DOM - 针对 XML 文档的标准模型

    HTML DOM - 针对 HTML 文档的标准模型

  

  左边为HTML文档树,右边为结构树示意图

      

  XML DOM 定义了访问和处理 XML 文档的标准方法。 

  HTML文档格式 符合XML语法标准,所以可以使用XML DOM API

  在XML DOM每个元素 都会被解析为一个节点Node,而常用的节点类型又分为:

    元素节点 Element

    属性节点 Attr

    文本节点 Text

    文档节点 Document

  HTML DOM定义了针对HTML文档的对象,可以说是一套更加适用于JavaScript 技术开发 的API

  HTML DOM是对XML DOM的扩展

  进行 JavaScript DOM开发,可以同时使用XML DOM和HTML DOM

  Node接口的特性和方法:

  Document对象常用方法:

      getElementById()返回对拥有指定 id 的第一个对象的引用

    getElementsByName()返回带有指定名称的对象集合

    getElementsByTagName()返回带有指定标签名的对象集合

  DOM 节点常用属性:

    nodeName

      如果节点是元素节点,nodeName返回这个元素的名称

      如果是属性节点,nodeName返回这个属性的名称

      如果是文本节点,nodeName返回一个内容为#text 的字符串

    nodeType

      Node.ELEMENT_NODE  -- 元素节点

      Node.ATTRIBUTE_NODE  -- 属性节点

      Node.TEXT_NODE  -- 文本节点

    nodeValue

      如果给定节点是一个属性节点,返回值是这个属性的值

      如果给定节点是一个文本节点,返回值是这个文本节点内容

      如果给定节点是一个元素节点,返回值是 null

  DOM节点常见操作:

    DOM 获取节点

    DOM 改变节点

    DOM 删除节点

    DOM 替换节点

    DOM 创建节点

    DOM 添加节点

时间: 2024-08-14 10:08:32

005_01文档对象模型DOM的相关文章

文档对象模型DOM

1.节点:      文档节点Document      元素节点Element      文本节点Text      属性节点Attr      注释节点Comment        2.节点的属性和方法:      nodeType:判断节点类型      ownerDocument:指向这个节点所属的文档      firstChild:指向在childNodes列表中的第一个节点      lastChild:指向在childNodes列表中的最后一个节点      childNodes

Document类型[第10章-文档对象模型DOM 笔记2]

Document 类型 JavaScript 通过 Document 类型表示文档.在浏览器中, document 对象是 HTMLDocument (继承自 Document 类型)的一个实例,表示整个 HTML 页面.而且, document 对象是 window 对象的一个属性,因此可以将其作为全局对象来访问. Document 类型可以表示 HTML 页面或者其他基于 XML 的文档.不过,最常见的应用还是作为HTMLDocument 实例的 document 对象.通过这个文档对象,不

Node节点类型[第10章-文档对象模型DOM 笔记1]

DOM是针对 HTML 和 XML 文档的一个 API(应用程序编程接口) .DOM描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.DOM 脱胎于Netscape 及微软公司创始的 DHTML (动态 HTML) , 但现在它已经成为表现和操作页面标记的真正的跨平台.语言中立的方式. 节点 DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构. 每个节点都拥有各自的特点.数据和方法,另外也与其他节点存在某种关系.节点之间的关系构成了层次,而所有页面标

第10章 文档对象模型DOM 10.3 Element类型

Element 类型用于表现 XML或 HTML元素,提供了对元素标签名.子节点及特性的访问. 要访问元素的标签名,可以使用 nodeName 属性,也可以使用 tagName 属性:这两个属性会返回相同的值.如下所示: <div id="myDiv"></div> var div = document.getElementById("myDiv"); alert(div.tagName); //"DIV" alert(d

第10章 文档对象模型DOM 10.2 Document类型

Document 类型 JavaScript 通过 Document 类型表示文档.在浏览器中, document 对象是 HTMLDocument (继承自 Document 类型)的一个实例,表示整个 HTML 页面.而且, document 对象是 window 对象的一个属性,因此可以将其作为全局对象来访问. Document 类型可以表示 HTML 页面或者其他基于 XML 的文档.不过,最常见的应用还是作为HTMLDocument 实例的 document 对象.通过这个文档对象,不

第10章 文档对象模型DOM 10.1 Node节点类型

DOM是针对 HTML 和 XML 文档的一个 API(应用程序编程接口) .DOM描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分.DOM 脱胎于Netscape 及微软公司创始的 DHTML (动态 HTML) , 但现在它已经成为表现和操作页面标记的真正的跨平台.语言中立的方式. 节点 DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构. 每个节点都拥有各自的特点.数据和方法,另外也与其他节点存在某种关系.节点之间的关系构成了层次,而所有页面标

文档对象模型DOM(二)

练习: 要求:界面上有个登录按钮,点击登录的时候,界面中弹出一个登录的方框,点击登录方框中的×的,登录方框消失. 1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <!--<link href="../css/lianxi1.css"

文档对象模型DOM(createNode)

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function t1(){ var div1 = document.getElementById("div1"); var p = document.create

JavaScript文档对象模型DOM

节点关系属性:(带element的属性ie低版本不支持) childNodes—所有子节点(元素,注释,文本): nodeType——属性代表节点类型: children——获取元素子节点 firstChild——第一个子节点(元素,注释,文本) *firstElementChild ——第一个元素子节点 lastChild ——最后一个子节点 (元素,注释,文本) *lastElementChild ——最后一个元素子节点 parentNode——父元素 offsetParent ——定位父级