DOM:

DOM 全称是 Document Object Model,也就是文档对象模型。

DOM 就是针对 HTML 和 XML 提供的一个API。什么意思?就是说为了能以编程的方法操作这个 HTML 的内容(比如添加某些元素、修改元素的内容、删除某些元素),我们把这个 HTML 看做一个对象树(DOM树),它本身和里面的所有东西比如

 

这些标签都看做一个对象,每个对象都叫做一个节点(node),节点可以理解为 DOM 中所有 Object 的父类。

 
 

DOM 有什么用?就是为了操作 HTML 中的元素,比如说我们要通过 JS 把这个网页的标题改了,直接这样就可以了:

document.title='how to make love';

这个 API 使得在网页被下载到浏览器之后改变网页的内容成为可能。

document

当浏览器下载到一个网页,通常是 HTML,这个 HTML 就叫 document(当然,这也是 DOM 树中的一个 node),从上图可以看到,document 通常是整个 DOM 树的根节点。这个 document 包含了标题(document.title)、URL(document.URL)等属性,可以直接在 JS 中访问到。

在一个浏览器窗口中可能有多个 document,例如,通过 iframe 加载的页面,每一个都是一个 document。

在 JS 中,可以通过 document 访问其子节点(其实任何节点都可以),如

document.body;document.getElementById('xxx');

DOM与document的区别的更多相关文章

  1. DOM BOM document window 区别

    DOM 是为了操作文档出现的 API,document 是其的一个对象: BOM 是为了操作浏览器出现的 API,window 是其的一个对象.   使用下图讲解:   归DOM管的: E区:即doc ...

  2. document.documentElement和document.body区别介绍

    document.documentElement和document.body区别介绍 * 区别 body是DOM对象黎明的body子节点,即标签 docummentElement 是整个树的根节点ro ...

  3. [转]JQ中$(window).load和$(document).ready区别与执行顺序

    一.$(window).load().window.onload=function(){}和$(document).ready()方法的区别 1.$(window).load() 和window.on ...

  4. sax/dom/jdom/dom4j的区别

    sax/dom/jdom/dom4j的区别[转] 博客分类: xml   网上能够查到很多的4种解析方式的区别,我再做一下摘录和总结,顺带给自己做个备份. SAX sax分析器在对xml文档进行分析时 ...

  5. javascript 对象(DOM)document window history

    Javascript对象 目录: window对象 document对象 history对象 navigator对象 window对象 所有浏览器都支持window对象,它表示浏览器窗口. 所有jav ...

  6. Commons JXPath - DOM/JDOM Document Access

    除了 JavaBean,JXPath 也可以访问 DOM/JDOM. 示例 XML: <?xml version="1.0" encoding="utf-8&quo ...

  7. DOM 之 document 查找元素方法

    DOM 之 document 查找元素方法 getElementById("idName"); // 始终取得第一个 idName 的元素 getElementsByTagName ...

  8. 认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构(节点树)。

    认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...

  9. window和document的区别理解,bom和dom的区别理解

    Window对象: 是整个BOM的核心,所有对象和集合都以某种方式回接到window对象.Window对象表示整个浏览器窗口,但不必表示其中包含的内容. Document对象: 实际上是window对 ...

随机推荐

  1. Cannot retrieve metalink for repository: epel 错误解决办法

    centos下安装完EPEL源, 然后更新一下yum缓存, 如果发现这样的错误:Error: Cannot retrieve metalink for repository: epel. Please ...

  2. vue项目从引入vue.js 改为使用vue-cil (webpack)时修改的一些内容

    在元素属性中不要写js关键字,会报使用关键字的错如@click='if(){}else{}', if-else 语句可以使用三元表达式或短路运算符来实现 v-for 不写:key  会有警告 ,使用: ...

  3. springBoot 全局异常捕捉

    package cn.com.cs.core.exception; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import or ...

  4. 【Python】【一些概念与对比】

    type.__new__()  : 返回类.可以把类看作是metaclass 创建出来的实例 普通类里的__new__() : 返回类的实例. __new__() : 返回类的实例.Python解释器 ...

  5. Intent 类型

    Intent 分为两种类型: 显式 Intent:按名称(完全限定类名)指定要启动的组件. 通常,您会在自己的应用中使用显式 Intent 来启动组件,这是因为您知道要启动的 Activity 或服务 ...

  6. WARNING: Configuration 'compile' is obsolete and has been replaced with 'implementation' and 'api'.

    点击报错信息中的app, 按照提示,修改compile 为 implementation 再次同步即可 结果

  7. [qt]qstring和string中文支持转换问题

    QString str2qstr(const string str) { return QString::fromLocal8Bit(str.data()); } string qstr2str(co ...

  8. 大话WebRTC的前世今生

    音视频的历史 音视频可以说是人类与生俱来的需求,人一出生就要用耳朵听,用眼睛看.中国的古代神话中为此还专门设置了两位神仙(千里眼和顺风耳),他们可以听到或看到千里之外的声音或景像. 为了解决听的远和看 ...

  9. iframe和ajax文件上传方法

    为什么使用这两种方法文件上传呢,主要是因为局部刷新问题 上传问题,主要是使用form表单,或者用请求一个文件上传 iframe 大多网站都是有一个整体的固定结构,然后进行局部刷新,我们可以使用AJAX ...

  10. lua --- 点号 和 冒号

    冒号的作用:1.定义函数时,给函数添加隐藏的第一个参数 self2.调用函数时,默认把当前调用者作为第一个参数传递进去 如 a:b(c) 可以理解为 a.b(a, c) 以下是用点号的定义和调用函数的 ...