dom元素的操作

一、dom元素的操作

1.dom元素的获取

dom元素的操作

2.动态创建dom元素

dom元素的操作

3.动态设置元素的属性

①给元素对象设置元素的自定义属性(对象.setAttribute("自定义属性","自定义属性的值"))

dom元素的操作
②自定义属性的获取(对象.getAttribute("自定义属性"))

dom元素的操作

③内置属性的操作

dom元素的操作

注:js如何获取其他样式

dom元素的操作
④操作属性

dom元素的操作

3.dom元素的追加

document.write()打印   .innerHTML给内容中追加  .innerText给文本中追加(不能用)

①appendChild ();给当前元素的内容之后进行追加(与运行过程有关)

②insertBefore();将元素追加到旧元素之前

③inserAfter ();

dom元素的操作

二、dom元素如何操作子节点

1.子节点的个数:childElementCount。

2. 子节点:childNodes。(元素 回车都算。<li>tea</li>回车)它是集合。

3.节点类型:nodeType。

js 节点类型:元素节点 1                属性节点 2                      文本节点 3                  注释节点 8              文档节点 9

 

拿到li元素的两种方法:

dom元素的操作

4.节点值:nodeValue。

5.找父元素的子元素

firstChild(返回所有节点,类似childNodes)

firstElementChild(返回元素的节点,类似children)

6.找子元素的父元素

节点:parentNode     元素:parentElement

7.找父元素的同级元素

节点:nextSibling   previousSibling   (下一个包括回车)

元素:nextElementSibling   previousElementSibling    (下一个元素)

注:节点中获取出的节点名称(nodeName)都是大写。