JavaScript Dom获取,创建,属性,节点关系,类型

dom的各种操作,优化建议..

一.获取节点方式

  • getElementByid
  • getElementsByTagName
  • getElementsByClassName
  • getElementsByName
  • querySelector
  • querySelectorAll

二.属性

property 方式:el.className

attr 方式:

  1. getAttribute(key)
  2. setAttribute(value)

区别:

attr 设置在dom树显示,property方式不显示

property 获取动态值 ,attr 获取初始值

三.创建

createElement

四.节点关系

父节点:parentElement

子节点:children

兄弟节点:nextElementSibling(下一个),previousElementSlibing(上一个)

五.插入节点

appendChild

六.删除

parent.removeChild()

扫描二维码关注公众号,回复: 14621655 查看本文章

el.remove()

七.节点的类型

nodeType:1 文本节点,3元素节点

八.优化

缓存节点

多次操作改为一次dom操作

文档片段

document.createDocumentFragment()

猜你喜欢

转载自blog.csdn.net/weixin_53150999/article/details/122806487