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的座標是到這個盒子的左上角的距離。