嗯，工作也有一段时间了，对编程的认识也深入了一些，以前认为HTML/CSS/JAVASCRIPT是比较简单的，看网上的教程就可以了，W3C是我学习这些知识常去的一个网站，非常感谢她让我学习到了更多的一些关于前端的知识，不过现在我不这样看了，前端工程师们最主要的就是通过这些来工作的（当然考虑的问题肯定是更多更广更深入了，架构问题、兼容性问题、性能问题、还有各种插件、JS库以及前端的各种工具等等），这些内容是非常丰富的，我也是挺感兴趣的并且觉得这样更为专业！至少让我觉得比天天，修改BUG、为客户修改数据、写一些文档、测试、发布、来回的几个项目间切换要好玩一些！以前写博客总想写一些他人从来没有写过的、自己亲身经历的、对他人和自己而言又是有一些价值的东西！现在我觉得自己的学习心得体会也是要记录下来的，毕竟即使简单的知识，如果不常常的使用也会随着时光的流逝而渐渐模糊的，记录下来、即使是按照自己的理解整理一下也能加深自己对知识的理解的！我不是天才，脑袋里没有公式、没有代码、没有对待世界特别的一种理解方式，那我就选择脚踏实地的一步一个脚印的走！

1：HTML DOM 是什么？

先来看一下一个简单的HTML文档的结构

<!DOCTYPE html>

<html lang="en">

    <head>

        <link rel=stylesheet href="">

        <meta charset="UTF-8">

        <title>文档标题</title>

    </head>

    <body>

        <div>文本内容</div>

        <div>

             <div></div>

        </div>

        <table></table>

    </body>

</html>

如果我们将此文档整个的顺时针旋转90度就会看到如下的样子

HTML DOM 的英文全称是：Hyper Text Markup Language Document Object Model 翻译成中文是，超文本标记语言的文档对象模型。我的理解是将HTML文档换一种视角来看待的方式，看成是一棵倒挂的DOM树，对HTML文档的操作可以看成是对DOM树的操作，HTML文档中的一切都映射在这一棵DOM树上！

W3C的解释是：DOM是W3C的标准，DOM定义了访问HTML和XML文档的标准（W3C DOM 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。）W3C标准被分成3个不同的部分：

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

2）XML DOM——针对XML文档的标准模型

3）HTML DOM——针对HTML文档的模型

我们这里仅关心HTML DOM，官方的描述他是：

1）HTML 的标准对象模型

2）HTML的标准编程接口

3）W3C标准

HTML DOM 定义了所有的HTML元素的对象和属性，以及访问他们的方法。简单点讲，HTML DOM 是关于如何获取、修改、添加或者删除HTML元素的标准。也就是换一种方式操作HTML文档的方法，主要的就是加上的JAVASCRIPT这门脚本语言的参与，对HTML文档进行操作！

2：HTML DOM 的作用是什么？

嗯，最主要的就是增强了网站的动态交互性，因为可以使用JAVASCRIPT或者服务器端的脚本来控制HTML文档了！

3：HTML DOM 的内容关键点是什么？

我觉得将HTML文档换成DOM树的这种视角来看待后，在对DOM树来操作，无论是修改、添加、删除、或者是改变节点的结构或者是样式，第一步总是要先获得一个节点的，就像对数据库里的数据进行操作一样增删改查，查的地位是相当重要的！所以，我门对待查询的方法和属性是要特别用心来学习的！

4：HTML DOM 的基本内容？

学习HTML DOM之前是需要了解HTML/CSS/JAVASCRIPT的，就像下图所表达的一样，只有这四者的配合才能更加灵活多变丰富多彩的展现出更加好玩的网页！

当然，使用DOM树的方式来表达HTML文档，也必须有自己的一套控制的方式方法的，我们要全面的转换视角。我们需要学习一些获取DOM树中节点的方法、修改节点的方法、添加节点的方法、删除节点的方法；改变节点的样式、结构等等，需要学习一些各种类型的节点以及节点的属性相关的内容，和HTML联系起来，我们需要知道某个节点是什么标签、他的属性、他的事件、他与其他节点的联系等等的内容，你能想到的更加合理和控制DOM树的方式、方法、属性、事件等等HTML DOM 都为我们想到了，这些就是我们需要学习的内容啦！

嗯，此篇的目标是让我对HTML DOM有一个比较清晰的认识，让我知道她是什么、有什么用、有哪些内容，然后我载慢慢的将它的内容补充上来！感谢W3C!

HTML DOM（学习笔记一）的更多相关文章

  1. Dom学习笔记

    今天老师出了一道面试题目:取到表单里面的textbox的值,两种方法.知道一种,老师说的什么dom,我竟然不知道. 以前学html的时候,老师也重来没有提到dom的概念.javaScript只是学了一 ...

  2. JS DOM学习笔记

    1.window对象代表当前浏览器窗口 2.使用window对象的属性.方法的时候可以省略window.例如:window.alert("hello")一般写成alert(&quo ...

  3. Dom学习笔记-（一）

    一.概述 DOM(文档对象模型)是针对HTML和XML文档的一个API,其脱胎于DHTML. DOM可以将任意HTML和XML文档描绘成一个由多层节点构成的结构. 每一个文档包含一个根节点-文档节点, ...

  4. BOM、DOM学习笔记——JavaScript

    1.BOM的概述    browser object modal :浏览器对象模型.    浏览器对象:window对象.    Window 对象会在 <body> 或 <fram ...

  5. DOM学习笔记--入门1

    HTML DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准. 首先节点有很多种,不仅仅HTML元素是节点,尤其 要注意文本节点的存在. 根据 W3C 的 HTML DOM 标准,HTML ...

  6. HTML DOM 学习笔记

    一.HTML DOM定义了所有HTML元素的对象和属性,以及访问他们的方法即:HTML DOM是关于如何获取,修改,添加,删除HTML元素的标准二.DOM节点1.分类整个文档是一个文档节点每个HTML ...

  7. DOM学习笔记（三）DOM元素的访问、修改与事件

    访问 HTML 元素等同于访问节点,使用的是document对象下的数个getElement方法,然后再对返回的元素(或元素列表)进行具体内容的访问和修改,或者响应对应的事件是操作 一些 DOM 对象 ...

  8. DOM学习笔记（二）对象方法与属性

    所有 HTML 元素被定义为对象,而编程接口(对象的访问)则是对象方法和对象属性. 事实上,常用的只用window对象及其子对象document对象,以及事件Event对象. Window 对象 Wi ...

  9. DOM学习笔记（一）DOM树

    DOM 定义了访问和操作 HTML 文档的标准方法. HTML 文档中的所有内容都是节点,将 HTML 文档表达为树结构,称为节点树 HTML DOM 树 HTML DOM 是关于如何获取.修改.添加 ...

  10. DOM学习笔记（思维导图）

    导图

随机推荐

  1. 更改AD查询LDAP条目的1000限制

    解除LDAP导入时的AD条目查询限制 解除LDAP导入或读取AD用户数限制问题 更改AD查询LDAP条目的1000限制 来源:http://www.jiancool.com/article/55373 ...

  2. 微软为Visual Studio开发助手拓展C++支持

    近日,微软宣布了一项 Visual Studio“开发助手”(Developer Assistant)插件的重大更新,其现已支持“基于 C++ 的情境感知 web 解决方案”.开发助手能够嵌入 Vis ...

  3. [zsh]zsh常用小技巧

    文章来源http://yijiebuyi.com/blog/3154040ae0aa3d352c61a10f2664591e.html shell基础: 查看当前使用shell类型: ->ech ...

  4. SQL Server 中LEN函数的问题

    LEN('T ') =1 LEN(' T') =2 在数据库中分解字符串时要注意,例如以'^'分隔'X ^ T ',分解时要注意最后的'T '被分解成'T' 可用如下的代码来进行完整的分解 SET A ...

  5. PHPWord生成word实现table合并（colspan和rowspan)

    PHPWord(http://phpword.codeplex.com/)是一个很好处理和生成WORD文档的工具,但是生成复杂的word,如colspan和rowspan的实现,还是需要你做些修改. ...

  6. Bellman-Ford & SPFA 算法——求解单源点最短路径问题

    Bellman-Ford算法与另一个非常著名的Dijkstra算法一样,用于求解单源点最短路径问题.Bellman-ford算法除了可求解边权均非负的问题外,还可以解决存在负权边的问题(意义是什么,好 ...

  7. Objective C SEl 和@selector是怎么工作的||How do SEL and @selector work in iphone sdk?

    SEL is a type that represents a selector in Objective-C. The @selector() keyword returns a SEL that ...

  8. Hololens开发笔记之Gaze凝视射线

    凝视是HoloLens首要输入方式,形式功能类似于桌面系统的光标,用于选择操作全息对象.然而在Unity中并没有明确的Gaze API或者组件. 概念上来说,Gaze是通过用户头部两眼之间发出一条向前 ...

  9. eclipse--解决Android模拟器端口被占用问题的办法

    一.问题描述 今天在Eclipse中运行Android项目时遇到"The connection to adb is down, and a severe error has occured& ...

  10. Ubuntu离线安装包制作（转载）

    From:http://blog.csdn.net/nupt123456789/article/details/11649603 1.应用场景 a.需要在多台电脑上安装同一软件,且软件很大,下载需要时 ...