js 注册事件机制问题

Question

js 注册事件机制问题不是很明白为啥在在 html 中调用 onclick 方法时, 需要写成 onclick="showMsg()", 而不是 onclick="showMsg"在 js 中调用 onclick 时, 需写成 msg2.onclick = showMsg, 而不是 msg2.onclick = showMsg()源码:  <div id="row">     <!--right-->     <p id="msg1" onclick="showMsg()">click me</p>          <!--error-->     <!--<p id="msg1" onclick="showMsg">click me</p>-->     <p id="msg2">click me too</p>   </div>js:    var row = document.getElementById('row');    var msg1 = document.getElementById('msg1')        var msg2 = document.getElementById('msg2')         // right     msg2.onclick = showMsg         // error     msg2.onclick = showMsg()        function showMsg (e) {     if (e && e.target) {      console.log(e.target)      } else {       console.log('click msg1');      }    }

Answer 1

在html中定义的onclick的值是字符串，而onclick浏览器会尝试把它当函数，于是会使用类似eval的方式去执行这段字符串。为啥不是指向方法就是因为从字符串是没法得到同名函数的，除非你知道函数属于哪个对象，然后通过中括号的方式得到函数。所以html里面不能写成函数名的字符串。

而js中你用ele.onclick = showMsg();这个的含义是把showMsg()的调用值赋值给onclick，得到的结果当然不和预期，onclick的值只能是函数或可执行的代码。