web - button.onclick = func（）; vs <button onclick =「func（）」？

Question

我是新來的JavaScript，我沒有使用jQuery。

我試圖讓我的功能btnHandle()當我點擊按鈕時運行。

但是，我發現

btn.onclick = btnHandle(); 

是從

<button id="sort-btn" onclick="btnHandle()">submit</button> 

當我使用btn.onclick = btnHandle();不同，當我刷新代碼而不點擊按鈕執行btnHandle()功能。

我希望只有當按鈕被點擊時才能執行該功能。

<button id="sort-btn" onclick="btnHandle()">submit</button>按我的意願工作。

爲什麼前一個不能正常工作？爲什麼onclick事件觸發頁面加載？

<button id="sort-btn" onclick="btnHandle()">submit</button> 

    <script type="text/javascript"> 

    function btnHandle() { 
     var aqiData = getData(); 
     aqiData = sortAqiData(aqiData); 
     render(aqiData); 
    } 


    function init() { 
     var btn = document.getElementById("sort-btn"); 
    //  btn.onclick = btnHandle(); 
    } 

    init(); 
    </script> 

Answer 1

正如凱文指出，由於你後有括號中的功能被立即執行。

但是，這兩種方法現在都已過時。您應該使用addEventListener：

btn.addEventListener('click', btnHandle); 

Answer 2

btn.onclick = btnHandle; 

沒有括號

btnHandle引用功能的同時 btnHandle（）執行功能