DOM---增删改查

100 阅读1分钟

查询节点

获取子元素 : 元素.children

        * 一定是伪数组
        
      2.获取兄弟元素
      
        2.1 获取上一个元素 :  元素.previousElementSibling
        
        2.2 获取下一个元素 :  元素.nextElementSibling
        
      3.获取父元素 : 元素.parentNode

新增节点:

  document.createElement() 使用三个流程

(1)在内存创建空标签:  document.createElement('标签名')

(2)设置内容
    
(3)添加到DOM树 :  父元素.appendChild( 子元素 ) 

appendChild 与 insertBefore 区别

  新增到最后面   :  父元素.appendChild( 子元素 ) 
  
  新增到指定元素的前面 :  父元素.insertBefore( 子元素 , 要加到哪个元素的前面 )
  

克隆节点 : 复制节点

        语法:  元素.cloneNode( 布尔类型 )
        
            false : 浅克隆. 只克隆自己,不克隆内容
            
            true : 深克隆. 克隆自己 + 克隆内容
            
        注意点: 克隆节点只是内存克隆,还需要手动添加到dom树
        

删 : 父元素.removeChild( 子元素 )

1.定时器作用 : 一段代码 间隔时间 重复执行

  2.定时器语法 :
  
   2.1 永久定时器 : 一旦开启,自动永久执行。只能手动清除
   
      (1)开启定时器: let timeID = setInterval( function(){} , 间隔时间)
      
      (2)清除定时器: clearInterval( timeID ) 
      
   2.2 一次定时器 : 间隔时间只会执行一次,执行完毕之后自动清除
   
      (1)开启定时器: let timeID = setTimeout( function(){} , 间隔时间)
      
      (2)清除定时器: clearTimeout( timeID )