绑定事件一般分为三种方法:
1 Dom0级
①在html中直接添加一个属性: <a href="http://www.github.com" onclick='show()'>github</a>
②在js标记中书写 btn.onclick = function(...){}
区别:前者在onclick里书写的是可执行的JavaScript代码,而不是一个函数;后者是直接绑定一个函数
请务必重视这里的区别!
取消默认行为(这里不提事件的那个方式)

我们可以这样取消
    <a href="http://www.github.com" onclick='display(); return false'>github</a>
也可以这样取消 
btn.onclick = function(){
	//somecode...
	return false;
就是不可以这样取消: 
<a href="http://www.github.com" onclick='display()'>github</a>
function display(){
	//...some code
	return false;
Why?
 由此可以看到我们取消默认行为关键理解html中的onclick只是一个h5属性,其属性的值会被保存在当前对象的onclick属性上,打印一下btn (写在html时 <button id='btn' onclick="show(); return false">click me</button>)
  
这便是为什么后者又可以因为它是直接绑定的;
  
 总结：Dom0级事件依赖于Dom对象的onclick属性；而两种方式绑定的规则不同； 
2** Dom2级**
 首先，不存在上述问题因为它压根不依赖onclick属性；
 绑定 一个事件监听 
btn.addEventListener('click',function(),..)
明确一下，addEventListener是一个函数是一个方法 
addEventListener
 
addEventListener()方法将处理程序注册为元素的侦听器
 此方法将指定的监听器注册到当前dom对象上，时间目标可以是任何一个支持事件的对象 
 关键字：监听器列表 
如何实现监听?
 在冒泡捕获阶段，来判断event.type达到监听目的，而this的问题也会用bind 或者handleEvent方法解决 
同步还是异步问题
 
事件既然是异步，那和同步代码写在一起不论书写顺序，一定是同步代码先执行；
 但实际好并不； 
btn.onclick = function(event){
console.log(event);
btn.onclick()//直接执行
// undefinde
 实际上任何事件的回调都涉及到一个监听，当我们没有监听成功那么便不存在什么事件和回调，只是作为一个普通代码执行了而已; 
this问题
 
先看addEventListener
 
后续请参考这篇总结事件是同步还是异步-总结
                    绑定事件的方法事件的本质取消默认事件addEvenListener一Dom能够将界面节点转换为一个个对象方便对其操作；Bom类似提供了很多接口现有&lt;button id = 'btn'&gt;一个简单的按钮&lt;/button&gt;二绑定事件一般分为三种方法:1Dom0级①在html中直接添加一个属性:&lt;a href="http://www.github.com" onclick='show()'&gt;github&lt;/a&gt;②在js标记中书写btn..
				javascript语言的执行环境是单线程（single thread），就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。
这种模式的好处是实现起来比较简单，执行环境相对单纯；但是只要耗时比较多，假如有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。为了解决这个问题，Javascript语言将任务的执行模式分成两种：同步（Synchronous）和异步（Asynchronous）。
同步模式: 就是一个任务先执行，后一个任务等待.
				狗都知道事件是异步的
一个页面里随处可见都是点击、鼠标经过、某个键盘被按下的操作，如果是同步的页面在这些行为没有执行的时候很显然永远不能完全显示！
 btn.onclick = function() {
            console.log(0);
        console.log(1);
这也是为什么这段代码在我点击后查看控制台是1 0
但是我换一种执行方式：
 (function() {
            btn.onclick = function() {
				一、HTML事件与JS方法
HTML常见事件有Window 事件、FORM表单事件、Mouse鼠标事件、Keyboard键盘事件，事件为固有属性，在编程过程中可以直接引用；【onclick="HT_0.window.Load_CP();"】
前端方法一般指JS函数，是用户根据需要编写的程序。【Load_();】
所有 HTML 元素被定义为对象，而编程接口则是对象方法和对象属性。
事件是用...
<button onclick='testClick()' id ='testClick' >按钮事件</button>
1.1通过事件属性onclick="函数"来实现onclick='testClick()'
1.2通过获取标签元素，然后对应其onclick事件
   //通过获取元素添加事件
				//使用pageinit 事件来设置代码脚本在DOM元素加载完成后开始执行
$(document).on("pagecreate","#pageone",function(){
    // jQuery 事件...
//点击事件
$("p").on("tap",function(){
    $(this).hide();
//长按事件   点击不放（长按） 事件在点击并不放（大约
② 第二个按钮其test函数和上面。
③  第三种方式： btn是拿到的这个按钮，也就是dom对象。这种写法是往对象身上添加一个方法，那这里一样的道理用自己写的onclick函数替换了dom对象上原本的那个属性
④dom2级
				在Vue中调用document.addEventListener添加事件回调函数,在回调函数中调用this对象时，通过调试发现，this指向的是之前调用document.addEventListener的Vue对象或者Vue组件示例代码如下:
<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <title>Title</title>
				同步和异步是两种不同的执行方式。在同步执行中，一个操作会阻塞当前线程，直到该操作完成并返回结果，才能继续执行下一步操作。而在异步执行中，当一个操作开始执行后，当前线程不会被阻塞，而是可以继续执行后续的操作，待该操作完成后再返回结果。
阻塞和非阻塞是与同步、异步相关的概念。阻塞式操作会一直等待操作完成并返回结果，而非阻塞式操作不会等待操作完成，而是立即返回一个状态或者空结果。在同步阻塞模式下，程序需要等待 I/O 操作完成后才能继续执行下一步操作，而在异步非阻塞模式下，程序可以同时处理多个 I/O 操作，提高了程序的并发性能。
总的来说，同步异步是关注点在调用方式上，阻塞非阻塞则是关注点在操作的执行方式上。