`
webdev2014
  • 浏览: 679218 次
文章分类
社区版块
存档分类
最新评论

JavaScript学习篇之——DOM学习

 
阅读更多


DOM是什么


DOM称为文档对象模型,是HTML文档和XML文档等文档的应用程序接口,。它提供了一种结构化的文档表示方式,从而使你可以修改它的内容以及最终的表达方式,进而将网页和脚本货或编程语言连接了起来。

DOM作用


DOM是用来访问或操作HTML文档、XML文档中的节点元素,DOM通过创建树来表示文档,把整个页面规划成由节点层级构成的文档,从而使开发者对文档的内容和结构具有空前的控制力,用DOM可以定义对象、方法和属性,用于访问、操作和创建文档中的内容、结构样式以及以及轻松的删除、添加和替换节点等行为。

DOM特点

DOM分类


核心DOM,定义了一套标准的可以针对任何文档的对象。

HTML DOM,针对HTML文档的DOM,我们看得姜浩的DOM视频主要讲的就是HTML DOM的内容,关于HTMLDOM的详细内容我们会在下篇文章中进行讲述。

XML DOM:针对XML文档的DOM

DOM的级别


DOM0:不是W3C规范,没有这个标准,只是DOM的一个历史参考点。

DOM1:开始是W3C规范,专注于HTML文档和XML文档,只有一个目标,就是规划文档的结构。

DOM2:添加了对鼠标和用户界面事件、范围、遍历的支持并对DOM1增加了样式表对象模型,

DOM3:对DOM2增加了内容模型和文档验证

DOM树形结构


HTML文档是树形结构,跟为<HTML>DOM也是树形结构,跟为Windowdocument对象,所以DOM就可以把HTML以树形的形式呈现出来。


DOMJavaScript联系


JavaScript可以通过DOM来访问和操作HTML文档所有的元素。

JavaScript是一种脚本语言,DOM是用来获得和操作HTML文档节点属性的,JavaScript通过DOM来获得和操作HTML属性的。


<script>  
    function test(){  
        window.alert("成功。");  
    }  
</script>  

<input type=button value="提交" onclick="test()">  



把上述代码复制到一个文件里,改成.html扩展名后,打开此html文档,点击"提交"按钮会弹出"成功"对话框。

其中:

第1,2,4,5行是JavaScript代码。

第3行是DOM代码(此行一定不要混淆成是JavaScript代码)。这就是JavaScript调用DOM的例子。

第6行是html代码

注意,DOM 不是 JavaScript专有的,事实上许多其他语言都实现了它。不过,Web 浏览器中的 DOM 已经用 ECMAScript 实现了,现在是 JavaScript语言的一个很大组成部分。

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics