HTML DOM 对象
DOM Document
DOM Element
DOM Attribute
DOM Event

Document对象

每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。

Element（元素）对象

Element 对象可以拥有类型为元素节点(如div、span、a等)、文本节点、注释节点的子节点。
NodeList 对象表示节点列表，比如 HTML 元素的子节点集合。
元素也可以拥有属性。属性是属性节点（参见下一节）。

Attr （属性）对象
属性属于 HTML 元素。（元素才有属性嘛）

Event（事件） 对象
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用，函数不会在事件发生前被执行！

Document与Element两者区别

Element是Document的一个对象元素

Document是文档，每个载入浏览器的 HTML 文档都会成为 Document
Element是文档里的元素，HTML 元素指的是从开始标签到结束标签的所有代码。常见的有div、span等

document是指文档模型，将整个页面作为一棵dom树来处理。其结构为：

<!doctype html>

<html>...</html>

而document.Element，注意其中的element，元素（也就是一个标签以及里面的数据），说明这是一个文档元素，是这个文档的根元素以及其包含的所有数据。其结构为：

<html>...</html>

3-Dom的更多相关文章

  1. 关于DOM的操作以及性能优化问题-重绘重排

     写在前面: 大家都知道DOM的操作很昂贵. 然后贵在什么地方呢? 一.访问DOM元素 二.修改DOM引起的重绘重排 一.访问DOM 像书上的比喻:把DOM和JavaScript(这里指ECMScri ...

  2. 读书笔记：JavaScript DOM 编程艺术（第二版）

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  3. 页面嵌入dom与被嵌入iframe的攻防

    1.情景一:自己的页面被引入(嵌入)至别人的页面iframe中 if(window.self != window.top){ //url是自己页面的url window.top.location.hr ...

  4. 通俗易懂的来讲讲DOM

    DOM是所有前端开发每天打交道的东西,但是随着jQuery等库的出现,大大简化了DOM操作,导致大家慢慢的“遗忘”了它的本来面貌.不过,要想深入学习前端知识,对DOM的了解是不可或缺的,所以本文力图系 ...

  5. HTML DOM 介绍

    本篇主要介绍DOM内容.DOM 节点.节点属性以及获取HTML元素的方法. 目录 1. 介绍 DOM:介绍DOM,以及对DOM分类和功能的说明. 2. DOM 节点:介绍DOM节点分类和节点层次. 3 ...

  6. HTML DOM 对象

    本篇主要介绍HTML DOM 对象:Document.Element.Attr.Event等4个对象. 目录 1. Document 对象:表示文档树的根节点,大部分属性和方法都是对元素进行操作. 2 ...

  7. 重撸js_2_基础dom操作

    1.node 方法 返回 含义 nodeName String 获取节点名称 nodeType Number 获取节点类型 nodeValue String 节点的值(注意:文本也是节点) 2.inn ...

  8. 虚拟dom与diff算法 分析

    好文集合: 深入浅出React(四):虚拟DOM Diff算法解析 全面理解虚拟DOM,实现虚拟DOM

  9. 窥探Vue.js 2.0 - Virtual DOM到底是个什么鬼？

    引言 你可能听说在Vue.js 2.0已经发布,并且在其中新添加如了一些新功能.其中一个功能就是"Virtual DOM". Virtual DOM是什么 在之前,React和Em ...

  10. jQuery学习之路（2）-DOM操作

    ▓▓▓▓▓▓ 大致介绍 jQuery作为JavaScript库,继承并发扬了JavaScript对DOM对象操作的特性,使开发人员能方便的操作DOM对象. ▓▓▓▓▓▓ jQuery中的DOM操作 看 ...

随机推荐

  1. Varint code

    Varint编码   LevelDB内部通过采用变长编码,对数据进行压缩来减少存储空间,采用CRC进行数据正确性校验.下面就对varint编码进行学习. 传统的integer是以32位来表示的,存储需 ...

  2. [原]使用MachOView辅助破解AppStore应用

    在破解iOS应用的过程中,需要经常使用 otool 开获取程序本身的信息(比如:是否启用了PIE),获取加密信息, 但是CLI的程序在直观性上还是不如GUI的, 下面描述使用MachOView来查看到 ...

  3. 【hanoi】hanoi移动次数和移动步骤

    #include<stdio.h> #include<stdlib.h> //移动次数 int hanoi(int num) { ; ) { ; } else { all = ...

  4. 验证码生成组件--JCaptcha的使用

    以下为项目中所用代码,文笔有限,直接上代码. 所需jar包: 是否需要其他依赖包,不详 web.xml <servlet> <servlet-name>Jcaptcha< ...

  5. K-Means算法

    K-Means算法 K-Means算法的输入N,K和一个size为N的向量组vector.输出K个两两互不相交的向量组.其本质是将给定的向量组划分成K个类别,使得同类别的向量相似度比较大,而不同类别的 ...

  6. JAVA小知识点-Finally和Return的执行关系

    如果Try和Catch中存在return语句的时候Finally内的语句是否会执行,执行的时候对结果又有什么影响呢?我写了个例子来试验这个问题: public static Map<String ...

  7. mongDB主从

    MongoDB[第二篇]MongodDB主从 官方网站:http://www.mongodb.org/ MongoDB的一些参数 --logpath 日志文件路径 --master 指定为主机器 -- ...

  8. Android与js交互实例

    Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true Android(Java)与JavaScript(HTML) ...

  9. java基础知识拾遗(四)

    1.Runnable对象 启动线程:(new Thread(new MyRunnable()).start() 2.jsp中<%@ page language="java" ...

  10. Android KeyLogger Demo

    @author: dlive 代码见github: https://github.com/Dliv3/Android-KeyLogger-Demo 前言 之前开发过一个Android的木马,其中Key ...