一个dom,点击事件触发两个事件是同步还是异步

问题产生原因：
用户充值接口，一个选择支付方式的dom绑定了一个插入订单的 ajax。
为了监测用户点了哪个支付方式，现在要把选择哪个支付方式记录下来。

当然可以在这个ajax请求的方法里面加入一个插入监测数据。但是考虑到插入订单的时候要与很多支付平台对接，速度会本来比较慢。万一出现意外情况导致订单插入失败，会比较麻烦。
然后研究了下。一个dom绑定两个事件，执行顺序的问题。

$('#dom').onclick(function1 (){
  $.ajax({
     ...
  });
);

$('#dom').onclick(function2 (){
  $.ajax({
     ...
  });
);

看到的别东西：

JS事件绑定的几种方式

 1. <div id="outestA" onclick="return buttonHandler(this);"></div>  
 2. <div id="outestA" onclick="var id = this.id;alert(id);return false;"></div> 
 3. var dom = document.getElementById("outestA");  
    dom.onclick = function(){alert("1=" + this.id);};  
    dom.onclick = function(){alert("2=" + this.id);}; 后面的会覆盖前面的
4.  addEventListener(type, listener, useCapture);
// type:事件类型,不含"on",比如"click"、"mouseover"、"keydown";  
// 而attachEvent的事件名称,含含"on",比如"onclick"、"onmouseover"、"onkeydown";  (IE特有)
// listener:事件处理函数  
// useCapture是事件冒泡,还是事件捕获,默认false,代表事件冒泡类型      ps：翻译是否使用捕获  
//同一个事件函数，并且事件类型都为冒泡或者事件捕获类型,那只能绑定一次，

JS事件冒泡和事件捕获

userCapture 为false
事件冒泡执行顺序：   从内部到外部Document。

userCapture 为true
事件捕获执行顺序 ： 从Document向内部执行

Dom事件流：包含userCapture ture 和 false
捕获阶段的处理函数最先执行，其次是目标阶段的处理函数，最后是冒泡阶段的处理函数。
目标阶段的处理函数，先注册的先执行，后注册的后执行。

从这里看，执行肯定是有先后顺序的。那如果其中的一个ajax有问题，会不会影响到另一个的运行？

<span class="test">测试Ajax执行顺序</span>>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$('.test').click(function(){
    $.ajax({
        url:'http://test.iok.la/sdk/',
         type:'post',

  dataType:"jsonp",
        success:function(res){
            console.log(res);
        },

    });
});
$('.test').click(function(){
    $.ajax({
        url:'http://test.iok.la/sdk2',
         type:'post',
           dataType:"jsonp",
        success:function(res){
            console.log(res);
        },

    });
});

</script>

• 测试结果，第一个ajax先运行。
• 第一个不会影响第二个的运行（链接错误或者 在后端sleep(20)都不影响）。

是异步的！其实想一想也是，ajax 本来一个特性就是异步的。。。。。。。正常来说的话也应该是这样子的。。。。

小收获

发现了一篇文章 主体的内容将的是 JS操作DOM到底是同步还是异步的
https://segmentfault.com/q/1010000005630545?_ea=903562

额…………看了好久，还是没怎么懂他们要表达的内容。。。。暂时先放一放~~以后研究

//显示加载动画

js 延迟加载，setTimeout

utils.loading();  
//让JS线程等待100毫秒,等待会让UI渲染进程实现，  
//如果发现setTimeout还要隔较长时间才到期，为了避免时间上的浪费，浏览器选择马上切换到UI线程。   
setTimeout(function(){  
    //长时间的js计算，同步请求等耗时操作  
    for(var i=0;i<100;i++){  
        console.log(11);  
    }  
    //关闭加载动画  
    utils.closeload();  
},1000);