[未完成]关于DOM的总结

这样有什么好处吗?
一但这些东西变成了节点对象,意味着每一个节点对象都会有很多属性和行为提供出来。
如果div是一个对象,那么就可以针对这个对象调用其中的一些方法,对div操作。
这个操作可以包括,比如,想把div删除,想加一个div,想在dl中加一个dt。
到底是删除还是添加,我对外提供 一个按钮,点击按钮进行删除还是添加,由用户来决定,这样就动态了文档。
只有把HTML中的标签变活了才能操作,否则是死的,无法操作。
这就是DOM中最核心的,把文档以及文档中所有的内容变成了对象。
DOM:Document Object Model(文档对象模型)
用来将标记型文档封装成对象,并将标记型文档中的所有的内容(标签,文本,属性等)都封装成对象。
封装成对象的目的是为了更为方便的操作这些文档以及文档中的所有内容。
因为对象的出现就可以有属性和行为被调用。
文档对象模型
文档:标记型文档。
对象:封装了属性和行为的实例,可以被直接调用。
模型:所有标记型文档都具备一些共性特征的一个体现。
标记型文档(标签,属性,标签中封装的数据).
只要是标记型文档,DOM这种技术都可以对其进行操作。
常见的标记型文档:html xml
DOM这种技术是如何对标记型文档机型操作的呢?
要操作标记型文档必须对其进行解析。
DOM技术的解析方式:将标记型文档解析一棵DOM树,并将树中的内容都封装成节点对象。
注意:这个DOM解析方式的好处:可以对树中的节点进行任意操作,比如:增删改查。
弊端:这种解析需要将整个标记型文档加载进内存。意味着如果标记型文档的体积很大,较为浪费内存空间。
简介另一种解析方式:SAX:是由一些组织定义的一种民间常用的解析方式,并不是w3c标准,而DOM是W3C的标准。
SAX解析的方式:基于事件驱动的解析。获取数据的速度很快,但是不能对标记进行增删改。
现在很多应用软件既有DOM又有SAX。
DOM模型有三种:
DOM level 1:将html文档封装成对象。
DOM level 2:在leve 1基础上加入了新功能,比如解析名称空间。
DOM level 3:将xml文档封装成了对象。
DHTML:动态的HTML。不是一门语言:是多项技术综合体的简称。
其中包含了HTML,CSS,DOM,Javascript。
这四个技术在动态html页面效果定义时,都处于什么样角色呢?负责什么样的职责呢?
HTML:负责提供标签,对数据进行封装,目的是便于对该标签中的数据进行操作。
简单说:用标签封装数据。
CSS:负责提供样式属性,对标签中的数据进行样式的定义。
简单说:对数据进行样式定义
DOM:负责将标签型文档以及文档中的所有内容进行解析,并封装成对象,在对象中定义了更多的属性和行为,便于对对象操作。
简单说:将文档和标签以及其他内容变成对象。
JS:负责提供程序设计语言,对页面中的对象进行逻辑操作。
简单说:负责页面的行为定义。就是页面的动态效果。
所以javascript是动态效果的主力编程语言。
DHTML+XMLhttpRequest = AJAX
BOM:Browser Object Model 浏览器对象模型。
这个模型方便于操作浏览器。
浏览器对应的对象就是window对象。这个可以通过查阅dhtml api获得。
-->
[未完成]关于DOM的总结的更多相关文章
- JavaScript DOM 编程艺术·setInterval与setTimeout的动画实现解析
先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...
- DOM的认识以及一些节点的应用
HTML DOM (文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). HTML DOM 模型被构造为对象的树. HTML DOM 树 通过 ...
- 《JavaScript DOM编程艺术》学习笔记(三)
终于要完成这最后一部分了,距离第二部分已经过去五天了,一直想早点写的,但还是拖到今天了………… 34.position属性的和法制:static是position属性的默认值,意思是有关元素将按照它们 ...
- 优化--前端(全占课,未完成作业:);CDN; Http/2的设置(未完成)
前端效能: 关键渲染路径:Google 文档 JavaScript 加载最佳化 让html和javascript同时渲染: 设置<script>的async或者defer属性(boolea ...
- react之四种组件中DOM样式设置方式
1.行内样式 想给虚拟dom添加行内样式,需要使用表达式传入样式对象的方式来实现 行内样式需要写入一个样式对象,而这个样式对象的位置可以放在很多地方 例如:render函数里.组件原型上.外链js文件 ...
- 关于DOM的操作以及性能优化问题-重绘重排
写在前面: 大家都知道DOM的操作很昂贵. 然后贵在什么地方呢? 一.访问DOM元素 二.修改DOM引起的重绘重排 一.访问DOM 像书上的比喻:把DOM和JavaScript(这里指ECMScri ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- 页面嵌入dom与被嵌入iframe的攻防
1.情景一:自己的页面被引入(嵌入)至别人的页面iframe中 if(window.self != window.top){ //url是自己页面的url window.top.location.hr ...
- 通俗易懂的来讲讲DOM
DOM是所有前端开发每天打交道的东西,但是随着jQuery等库的出现,大大简化了DOM操作,导致大家慢慢的“遗忘”了它的本来面貌.不过,要想深入学习前端知识,对DOM的了解是不可或缺的,所以本文力图系 ...
随机推荐
- JavaSE聊天室
今天学习了一下简单聊天程序(类似QQ那种)的编写过程,从最初的0.1版本到最后的1.3版本,功能不断地增强,下面对一天的学习内容进行梳理. 版本0.1 我们的需求是显示一个窗体,其他什么也不用做,其他 ...
- Gym 100818F Irrational Roots (数学)
Irrational Roots http://acm.hust.edu.cn/vjudge/contest/view.action?cid=101594#problem/F [题意]: 判断一个整系 ...
- VIM技巧(2)-删除匹配行
VIM技巧(2)-删除匹配行 代码如下: * @Company:中国股份有限公司 * @author ymzhao (也有zyyang的) * @Date: Jan 22, 2014 11:25:29 ...
- [C语言 - 10] C语言保留字
一 数据类型关键字 12 个: 1 . char 2 . short 3 . int 4 . long 5. enum 6. float 7. dou ...
- c++的操作符格式记录
以下摘自维基百科,mark一下,以备不时之需. For the purposes of this table, a, b, and c represent valid values (literals ...
- Swift学习笔记三
协议和扩展 在Objective-C中,协议是很常见也非常重要的一个特性,Swift中也保留了协议,语法略有变化. 用protocol关键字声明一个协议: protocol ExampleProtoc ...
- hdu 5279 Reflect phi 欧拉函数
Reflect Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://bestcoder.hdu.edu.cn/contests/contest_chi ...
- 跨平台实现wchar_t转成char
位宽.其实知道了这个以后,要在wchar_t 和 char两种类型之间转换就不难实现了. wchar_t 转换为char 的代码如下: 有如下的wchar_t和char变量 wchar_t w_cn ...
- 数据挖掘十大经典算法(9) 朴素贝叶斯分类器 Naive Bayes
贝叶斯分类器 贝叶斯分类器的分类原理是通过某对象的先验概率,利用贝叶斯公式计算出其后验概率,即该对象属于某一类的概率,选择具有最大后验概率的类作为该对象所属的类.眼下研究较多的贝叶斯分类器主要有四种, ...
- 开发者必备,超实用的PHP代码片段(转)
此前,研发频道曾发布<直接拿来用,10个PHP代码片段>,得到了网友们的一致好评.本文,笔者将继续分享九个超级有用的PHP代码片段.当你在开发网站.应用或者博客时,利用这些代码能为你节省大 ...