DOM

1.简单认识DOM

对一个节点进行新增,删除,或者对某一个节点进行添加类名,删除类名

2.非常规 获取

1.获取html页面标签(包括html里面的对象)
    document.documentElement

2.获取body标签对象
    document.body

3.获取head标签对象
    document.head

3.常规获取

1.通过类名 获取标签对象
    document.getElementsByClassName('类名')

2.通过标签名 获取标签对象
    document.getElementsByTagName('标签名')

!! 获取到的数据 是伪数组的形式 就是只有一个数据 也是伪数组的形式 需要里面的某一个对象 可以通过索引下标拿取
!! 伪数组 长得像数组 有索引 有length  但是没有数组的方法 

3.通过id名去获取标签对象
    document.getElementById('id名')

4.通过选择器的形式 获取到符合条件的第一个标签对象
    document.querySelector('选择器名')

5.通过选择器的形式 获取到符合条件的所有标签对象
    document.querySelectorAll('选择器名')

4.设置页面内容

    对象.innerHTML(获取内容)
    对象.innerHTML='设定的内容'
    可识别html结构

    对象.innerText='设定内容'
    不可以识别html结构 如果有html结构 会自动转化为 字符串

5.元素属性的设置与获取

    获取
        对象.getAttribute('需要查找的属性名')
    修改/新增
        对象.setAttribute('属性名','属性值')
    删除
      对象. removeAttribute('属性名')

6.H5自定义属性

   属性为: data-cs="123456789"
   data- 是H5自定义语法中 固定的  后面的cs才是属性名 123456789 是属性值
    获取
        对象.dataset.属性名
    修改/新增
        对象.dataset.属性名='需要设定属性值'
    删除
        delete 对象.dataset.需要删除的属性名