html 是基于Xml的文档规范。是一种特殊的xml文档,这一点很重要

1.xml 文档的操作,java,c#,...各种语言都提供了很好的api对文档进行解析,操作。当然js 也不例外,提供了一系列的方法。

具体的方法,w3c 上都有讲解。Document,Node,   ElementNode,TextNode,AttributeNode,CommentNode,NodeList 这些都是xml的属性

xml 里面每个节点都是一个node对象,

2.html 是一种特殊的xml文档,那么特殊的地方在哪?

1) html 封装好了一系列的对象,比如 image,Table,Form,Input,Select...等等

我们可以用new Image() 这种方式去创建对象

html 里每个节点都是element对象,

2) html dom 提供了更方便的方法去访问节点, xxx.className, xxxx.id 等等,

在标准的xml 文档中,应该用getAtrribute() 去访问。  当然htm dom 也可以用这种方式去访问,因为它是xml

3.在加载html时,浏览器会创建全局的window对象,然后下载html文档,创建document对象,并把这个document对象赋值给全局的window对象。

这里创建的document 是 HTMLDocument , HTMLDocument 接口对 DOM Document 接口进行了扩展,定义 HTML 专用的属性和方法。在新的规范中

html中的元素都是htmlelment对象,HTMLElement 对象继承了 Node 和 Element 对象的标准属性。  意思就是 span div这些节点 可以使用node对象和element对象的方法

xml dom 与htm dom 在用途上相互补充,

4.tips

document.getElmentsByTagName  返回的是动态的Nodelist ,document.querySeletorAll() 返回的是静态的Nodelist

Nodelist 是xml dom 属性,以上二个方法也属于Xml Dom。

动态是指:

HTMLCollection、NodeList以及NamedNodeMap这三个集合都是“动态的”,每当文档发生变化时,他们都会更新。他们将始终保持这最新、最准确的消息。且看以下程序:

           var divs = document.getElementsByTagName("div"),

                i,

                div;

            for (i = 0; i < divs.length; i++) {

                div = document.createElement("div");

                document.body.appendChild(div);

            }

以上代码是个死循环!

另外htmlcollections ,是返回一些htmlelement集合,比如 获取select 下面option, form 下面的表单元素等。

5.htmelement 都有nodetype属性,如下

元素element 1
属性attr 2
文本text 3
注释comments 8
文档document 9

window.Node 有个全局的函数,里面包含了全部NodeType 静态值

相信 有了以上的指导思想,在理解很多方法,模型上很有帮助

htm Dom对象与 Xml Dom对象的理解的更多相关文章

  1. 雷林鹏分享:XML DOM

    XML DOM DOM(Document Object Model 文档对象模型)定义了访问和操作文档的标准方法. XML DOM XML DOM(XML Document Object Model) ...

  2. xml dom minidom

    一. xml相关术语: 1.Document(文档): 对应一个xml文件 2.Declaration(声明): <?xml version="1.0" encoding=& ...

  3. XML DOM学习

    XML 文档对象模型定义访问和操作XML文档的标准方法. XML DOM 是 XML Document Object Model 的缩写,即 XML 文档对象模型. DOM 将 XML 文档作为一个树 ...

  4. python use dom to write xml file

    #encoding:utf-8 ''' write xml in dom style ''' from xml.dom.minidom import Document doc = Document() ...

  5. python模块:xml.dom.minidom

    """Simple implementation of the Level 1 DOM. Namespaces and other minor Level 2 featu ...

  6. Javascript 解析字符串生成 XML DOM 对象。

    Javascript 接收字符串生成 XML DOM 对象.实测对 Firefox .IE6 有效.可用于解析 ajax 的服务器响应结果,也可用于解析自定义字符串.​1. [代码]函数   ppt模 ...

  7. js ajax 传送xml dom对象到服务器

    客户端代码 1 <script> var isie = true; var xmlhttp = null; function createXMLHTTP() {//创建XMLXMLHttp ...

  8. XML DOM - Range 对象

    Range对象 Range对象表示文档的连续范围区域,如用户在浏览器窗口中用鼠标拖动选中的区域.   dom标准Range对象 在IE中使用TextRange对象 range对象常用的建立方法在开发中 ...

  9. dom对象详解--document对象(一)

     document对象 Document对象代表整个html文档,可用来访问页面中的所有元素,是最复杂的一个dom对象,可以说是学习好dom编程的关键所在. Document对象是window对象的一 ...

随机推荐

  1. android TextView加载html内容并加载图片

    package com.example.textviewfromhtml; import java.net.URL; import android.app.Activity; import andro ...

  2. 2>&1 的用法说明

    经常关注linux脚本的人,一定看到过 2>&1 这样的用法,最初一定不明白其中的含义以及为什么是这样的一种组合.昨天偶然间再次看到了这个 2>&1 的写法,遂下决心搞明白 ...

  3. python中split函数的使用

    最近学习python,对split函数做了下总结,内容如下:

  4. 结对2.0--复利计算WEB升级版

    结对2.0--复利计算WEB升级版 复利计算再升级------------------------------------------------------------ 客户在大家的引导下,有了更多 ...

  5. Bone Collector II

    Bone Collector II Time Limit: 5000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) T ...

  6. Counting Rectangles

    Counting Rectangles Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 1043 Accepted: 546 De ...

  7. Unity-Animator深入系列---StateMachineBehaviour初始化时间测试

    回到 Animator深入系列总目录 结果和想的有点出入 测试结果: 1.SMB初始化会被调用多次,次数不可控,当Animator组件重复开关则重复初始化. 2.SMB支持构造函数 MyClass p ...

  8. 水流雨渍shader

    战神斯巴达之魂的雨渍做的很逼真,尝试了下,似乎是差不多了,整体欠缺不少 普通平面: 环形流动: 河流: shader实现,3层加上一个偏移层 圆形的雨渍流动和河流要重新展一下UV

  9. JAVA基础知识之JVM-——动态代理(AOP)

    代理模式简介 在很多场景下,我们想使用一个类(通常是接口)A时,并不是直接使用这个类,而是通过另外一个类B去调用A的方法,这里的类B就是一个代理类. 有很多场景都会用到这种方法,例如假如创建类A需要很 ...

  10. Easyui部分组件讲解

    Easyui部分组件讲解 目  录 1.... Accordion(可折叠标签)... 2 1.1          实例... 2 1.2          参数... 3 2.... DateBo ...