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. (转)awesome-text-summarization

    awesome-text-summarization 2018-07-19 10:45:13 A curated list of resources dedicated to text summari ...

  2. arm中断体系结构

     ARM处理器中有7种类型的异常,按优先级从高到低的排列如下:                   复位异常(Reset).     数据异常(Data Abort).     快速中断异常(FIQ) ...

  3. 比原链设计思考: 扩展性UTXO模型

    用户模型是比原链在最初就需要确定的重要数据结构, 团队的选择还是聚焦在两种典型的模型系统中,Account模型和UTXO模型,和其他大多数区块链设计一样, 选择了模型就决定了协议层的重要实现,两种模型 ...

  4. ActiveReports 大数据分析报告:公交车司乘冲突引发的刑事案件

    公交车司乘冲突刑事案件总体情况 公交车司乘冲突引发的刑事案件总量稳中有升 (注:本报告界定的“公交车司乘冲突刑事案件”,是指案件诱因为公交车司机与乘客在乘车过程中发生冲突而引发的刑事案件.包括但不限于 ...

  5. 更新:在MAC上安装RN开发环境的步骤(全)

    总共分为三部: 1:按照官网(中文)上的步骤去安装jdk和android studio 2:配置SDK 3:安装虚拟机和模拟器 所以这里提出的是注意事项: 1:~/.bash_profile 文件里面 ...

  6. docker 日志分析

    日志分两类,一类是 Docker 引擎日志:另一类是 容器日志. Docker 引擎日志 Docker 引擎日志 一般是交给了 Upstart(Ubuntu 14.04) 或者 systemd (Ce ...

  7. 有了art-template,如有神助

    <div class="form-group col-lg-12"> <label class="control-label col-lg-3 text ...

  8. tkinter拦截关闭事件

    import tkinter as tk from tkinter import messagebox root = tk.Tk() def on_closing(): if messagebox.a ...

  9. python第二章(2)列表

    names=["zhangyang","guyun","xiangpeng","leiming","xulia ...

  10. Codeforces 551 E - GukiZ and GukiZiana

    E - GukiZ and GukiZiana 思路:分块, 块内二分 代码: #pragma GCC optimize(2) #pragma GCC optimize(3) #pragma GCC ...