javascript Dom操作

  此文为自己初级学习后的结果

一.什么是Dom？

在浏览器中，系统会把html分析成树状结构，每一个html的标签都变成一个一个的节点，即层级关系。上一层的内容会影响到下一层的影响，这种构造对csss同                         样有效，父级的css会对子级的css产生一定的影响（当然，你可以通过设置自己的样式，来屏蔽到上层的影响）

1.1    什么是节点

元素节点:   <p></p>

文本节点: <p>这段文字就是文本节点</p>

属性节点: <div class="myclass"></div>   在标签里面的内容就是这个标签的属性

1.2 获取对应元素:

多数情况下，会有id 和class这两种情况去获取对应的节点，比如标签，或者需要多次使用的。使用class，具有唯一性的，使用id

<div id="dom"></div>//<div class="com"></com>

如果我们要在<script>获取这些元素该如何做

               var Dom=document.getElementByid("dom");               var Dom=document.getElementsTagname("com");

以上是对应的元素的获取

接下来我们获取元素的属性，并修改属性

1.3 基础描述：

web浏览器在解析DOM的时候用本人的话分为三层：骨架(html)，描述(css)，行为(javscsript)。解释如下：

骨架：

<p>标签等等，整个网站下来的基础的html标签代码

描述:

即css文件代码，用来把单调的html代码进行描绘，使网站变得更加美观

行为:

通过一些与用户，增加用户的体验，如鼠标滑动，鼠标点击，动画等等

如何对Dom进行操作？

写好了骨架和描述这两层之后，通过<script>脚本对dom进行进一步开发，在开发时强调文档分离，即css，javascript，html各自分为一个文档，这样的话会加快网站的效率，也便于后续人员的维护。(这点本人深有体会，如果不进行文档分离，对一个项目的后期维护就让接盘侠特别痛苦~)