DOM基本操作


查询元素


  /// 获取元素的 name 属性为div的元素 返回数组
  document.getElementsByName('div')

  /// 获取所有clss是div-style的元素 返回数组
  document.getElementsByClassName('div-style')

  /// 获取id是div-style的元素 返回单个元素
  document.getElementById('div-style')

  /// 获取dom内所有div返回数组  *通配符表示所有元素
  document.getElementsByTagName("div")

增加元素


   /// 获取本现有的本地元素
  let div =  document.getElementById('div-style')
  
  /// 创建li元素
  var li = document.createElement('li')
  
  /// 给li元素添加内容
  li.innerHTML = '你好'
  
  /// 把新创建的li添加到div中
  div.appendChild(li)
  
  
  /// 把新创建的li插入到第几个元素前
  div.insertBefore(li,li的后一个元素这个元素需要去获取)
  
  /// 注意
  /// 如果没有要插入的时候没有子元素那么就直接使用 appendChild

删除元素


  /// 获取本现有的本地元素
  let div =  document.getElementById('div-style')

  /// parentNode 这个属性是获取元素的父节点
  /// removeChild删除元素
  div.removeChild(div.parentNode)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容