DOM（Document object madle） 文档对象模型： 元素节点 文本节点 属性节点

Posted 2020-09-10 渡劫的机器猫

【DOM树节点】

 

DOM 节点分为三大类：元素节点 文本节点 属性节点

文本节点 属性节点 为元素节点的两个子节点

通过getElement系列方法，可以去到元素节点。

 

【查看节点】

 

1、document.getElementById：通过ID获取唯一的节点;多个同名ID，只会取第一个；

2、document.getElementsByName：通过name取到一个数组，包含1到多个节点；

使用方式：通过循环，取到每个节点。循环次数：从0开始，<数组.length

 

 

【查看和设置属性节点】

  1、查看属性节点；getAttribute("属性名")

  2、设置属性节点；setAttribute("属性名","属性值")

 

 

【js修改样式总结】

1、 .className ：为元素设置一个新的class名字；

   div1.className = "class1"

2、 .style ：为元素设置一个新的样式，注意驼峰命名法；

  div.style.backgroundColor = "red"；

3、 .style.cssText : 为元素同时修改多个样式；

  div.style.cssText = "width:100px;height:100px"

 

【js修改样式总结】

  1、 .className ：为元素设置一个新的class名字；

    div1.className = "class1"

  2、 .style ：为元素设置一个新的样式，注意驼峰命名法；

   div.style.backgroundColor = "red"；

  3、 .style.cssText : 为元素同时修改多个样式；

    div.style.cssText = "width:100px;height:100px"