js 函数中 event 参数 、位置

函数中传递 event + 其他参数

<div id="btn" onclick="clickBtn(event,2)">任务总数</div>
<script>
    function clickBtn(event,val){
        console.log(event);
        console.log(val)
    }
</script> 

注意：event可以调换前后顺序但必须是event关键字

如果不传递参数默认函数自带 event

<div id="btn" onclick="clickBtn()">任务总数</div>
    <script>
        function clickBtn(){
           var ev=event ||window.event || arguments.callee.caller.arguments[0]; ;  // 浏览器兼容
            console.log(ev);
        }
 </script> 

注意：event.srcElement问题
问题说明：IE下，even对象有srcElement属性，但是没有target属性；Firefox下，even对象有target属性，但是没有 srcElement属性。
解决方法：使用srcObj = event.srcElement ? event.srcElement : event.target;

不传递event的时候也可以传参 

 <div id="btn" onclick="clickBtn(2)">任务总数</div>
    <script>
        function clickBtn(a){
            console.log(event);
            console.log(a)
 }

"οnclick=function"

   <div id="btn">任务总数</div>
    <script> 
        var btn=document.getElementById('btn')
        btn.onclick=function(e){
            test(e,'aa')
        }
        function test(e,str){
            console.log(e.target)
            console.log(str)        
    }
    </script> 

addEventListener

 <div id="btn">任务总数</div>
    <script> 
        var btn=document.getElementById('btn')
        btn.addEventListener('click',function(e){
            test(e,'aa')
        })
        function test(e,str){
            console.log(e.target)
            console.log(str)        
    }
    </script> 

Event 参数中的坐标位置

窗口坐标：clientX、clientY
相对于用户浏览器的左上角的x、y坐标,也就是窗口坐标，不包括工具栏、滚动条。
clientX、clientY是相对于可视区窗口的坐标，即使有滚动条，在窗口(可视区窗口)相同的位置单击，坐标不变。

文档坐标：pageX、pageY
相对于当前浏览器，也就是文档左上角x、y坐标，
pageX=clientX + 页面滚动横向距离
pageY=clientY + 页面滚动纵向距离

屏幕坐标：screenX、screenY
相对于用户显示器的左上角x、y坐标，有多块屏幕以主屏幕为准。

元素偏移坐标：offsetX、offsetY
offset意为偏移量，鼠标距离被点击的元素距左上角的x、y坐标，包含padding；如果点击border 为负值。
如果给盒子定义一个点击事件，则这个offset的坐标是到这个盒子的左上角的距离。