DOM重点核心

	**创建**  document.write  innerHTML   createElement
    **增**   appendChild(后边)   inserBefore(前边)
    **删**   removerchild
    **改**   主要修改dom的元素属性

 1. 修改元素属性:src、href、title等
                
 2. 修改普通元素内容:innerHTML、innerText
                  
 3. 修改表单元素:value、type、disable等
                        
 4. 修改元素样式:style、className

   **查**   主要获取查询dom的元素 

 5. DOM提供的API方法：getelementById getElementsByTagName 方法古老不推荐
 6. H5提供的方法：querySelector querySelectorAll 提倡
 7. 利用节点操作获取元素：父(parentNode)、子(children)、兄(previousElementSibling、nextElementSibling)提倡

属性操作 主要针对于自定义属性

 8. setAttribute:设置dom的属性值

 9. getAttribute:得到dom的属性值

 10. removeAttribute移除属性

事件操作 给元素注册事件，采取 事件源 事件类型= 事件处理程序

//鼠标事件 onclick onmouseover onmouseout onfocus onblur onmousemove onmouseup onmousedown
//鼠标点击右键 鼠标经过 鼠标离开 获得鼠标焦点 失去鼠标焦点 鼠标移动触发 鼠标弹起触发 鼠标按下触发   

一、注册事件（绑定事件）

1.1 注册事件概述 给元素添加事件，称为注册事件或者绑定事件

利用on开头的事件onclick

<button onclick="alert('hi~~')"></button>
btn.onclick = function(){}

特点：注册事件的唯一性
同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数将会覆盖前面的注册函数

方法监听注册事件

addEventListener()    

特点：同一个元素同一个事件可以注册多个监听器

二、事件对象

事件对象

 var div = document.querySelector('div');
    div.onclick = function(e) {
        console.log(e);
        console.log(window.event);
    }
    div.onclick = function(event) {
        console.log(event);
    }

1. event 就是一个事件对象 写到我们侦听函数的 小括号里面 当参数来看
2. 事件对象只有有了事件才会存在， 他是系统给我们自动创建的，不需要我们传递数据
3. 事件对象 是 我们事件的一系列相关数据的集合 跟事件相关的 比如鼠标点击里面就包含了鼠标的相关信息，
   鼠标坐标啊 如果是键盘事件里面就包含的键盘事件的信息 比如 判断用户按下了那个键
4. 这个事件对象我们可以自己命名 比如 event、evt、e
5. 事件对象也有兼容性问题 ie678 通过 window.event

 //常见事件对象的属性和方法
    //1. e.target 返回的是触发事件的对象（元素）  this返回的是绑定事件的对象（元素）
    // 区别：e.target 点击了那个元素 就返回那个元素 this那个元素绑定了这个点击事件 那么就返回谁

    var div = document.querySelector('div');
    div.addEventListener('click',function(e) {
        console.log(e.target);
        console.log(this);
    })
    var ul = document.querySelector('ul');
    ul.addEventListener('click',function() {
        //我们给ul 绑定了事件 那么this  就是指向的ul
        console.log(this);
        //e.target 指向我们点击的那个对象 谁触发这个事件 我们点击的是li  e.target 指向的就是里
        console.log(e.target);
    })