onload和DocumentContentLoaded的区别？原生js如何实现事件的绑定和解绑？

1、

参考：简述domready和onload事件的区别
主要区别：
DocumentContentLoaded在DOM树加载完之后立刻触发，DOM树加载完成之后，继续加载图片等外部文件，加载完成之后，onload事件触发。

2、

参考：
原生js–事件绑定、事件监听器及事件解绑

（1）事件绑定方式

1. 内联模式（不符合结构、行为、样式相分离的原则）
2. 外联模式（同一事件只能给同一元素绑定一次）
3. 事件监听器

（2）事件监听器

1. addEventListener():

btn.addEventListener("click", handle, false);
     function handle() {
       alert("第一次点击")
     }

特点：
- 这一绑定方式可以给同一元素绑定多个事件，不会发生覆盖的情况。先绑定先执行
- true:在捕获阶段执行；false：在冒泡阶段执行、

2. attachEvent():

 btn.attachEvent("on" + "click", handle)

特点：
- 绑定事件类型前一定要加“on”
- 先绑定后执行
- 针对低版本EI，低版本EI中不存在捕获阶段

（3）事件解绑

1. 针对“on+事件类型”：btn.onclick = null
2. 针对addEventListener()：btn.removeEventListener("click", handle, false);
3. 针对attachEvent():btn.detachEvent("on" + "click", handle)