码迷,mamicode.com
首页 > 其他好文 > 详细

DOM基本操作

时间:2018-06-04 23:27:48      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:tee   添加   fir   before   lin   表示   获取   指定   元素属性   

1、获取元素

(1)docuent.getElementById()通过id获取元素

(2)docuent.getElementsByName()通过name属性获取元素

(3)docuent.getElementsByTagName()通过标签名获取元素

2、节点指针

  (1)父找子:

  ①firstChild()获取元素的首个子节点

  father.firstChild()

  ②lastChild()获取元素的最后一个子节点

  father.lastChild()

  (2)子找父:

  parentNode()获取已知节点的父节点

  son.parentNode()

  (3)兄弟节点:

  ①previousSilbing()获取已知节点的前一个兄弟节点

  brother.previousSibling()

  ②nextSibling()获取已知节点的后面一个兄弟节点

  brother.nextSibling()

  (4)childNodes()获取元素的子节点列表,获得的是一个类数组对象

  father.childNodes()

3、节点操作

  ①创建元素节点

  document.createElement("元素标签")

  ②创建属性节点

  dcument.createAttribute("元素属性")

  ③创建文本节点

  document.creaeTextNode("文本内容")

4、插入节点

  ①appendChild()向节点的子节点列表的末位追加节点

  father.appendhild(添加的新节点)

  参数:要添加的新节点

  返回值:要插入的元素

  ②insertBefore()在已知子节点前面插入一个新的子节点

  father.insertBefore(new,ref)

  参数:new表示新的子节点,ref表示已知子节点;当第二个参数为null时,会插入到最后面

  返回值:要插入的元素

  ③removeChild()删除指定的节点

  father.removehild(要删除的节点)

  参数:要删除的节点

  返回值:删除的节点

  ④replaceChild()替换节点

  replaceChild(要替换的元素,被替换的元素)

  参数:第一个参数替换后的新节点,第二个参数需要被替换的旧节点

  返回值:替换掉的旧元素

  ⑤cloneNode()复制节点

  cloneNode(bool)

  参数:布尔值,如果是1或true则复制当前节点和子节点;如果是0或false则只复制本身

5、属性操作

  ①getAttribute()获取属性

  元素节点.getAttribute(属性名)获取节点中指定属性的属性值

  ②setAttribute()创建或改变元素节点属性

  元素节点.setAttribute(属性名,属性值)

  ③removeAttribute()删除属性

  元素节点.removeAttribute(属性名)

DOM基本操作

标签:tee   添加   fir   before   lin   表示   获取   指定   元素属性   

原文地址:https://www.cnblogs.com/zjp-/p/9136386.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!