"click"和点击之间的区别

点击有什么区别

document.getElementById("myBtn").addEventListener("click", displayDate);

并在中点击

<!DOCTYPE html>
<html>
<body>
<h1 onclick="this.innerHTML='Ooops!'">Click on this text!</h1>
</body>
</html>

它们都被视为事件吗？为什么我们不能用点击代替点击，反之亦然？

区别在于第一个（click）是事件侦听器，第二个（onclick）是事件处理程序内容属性。

事件处理程序内容属性存储内部未编译的原始处理程序，该处理程序通过事件处理程序处理和获取事件处理程序算法的当前值来生成事件侦听器。

在实践中，这会影响范围，例如

(function() { var element = document.body;
  var str = "console.log([typeof foo, typeof bar])";
  var func = function() { console.log([typeof foo, typeof bar]); };
  element.foo = 'foo';
  var bar = 'bar';
  element.setAttribute('onclick', str);
  element.addEventListener('click', func);
  element.click();
  // Event handler content attribute logs ["string", "undefined"]
  // Event listener logs ["undefined", "string"]
})();

我不鼓励使用事件处理程序。它们是一段古老的回忆，被事件听众所取代。

是的，它们都是事件，只是放在同一个位置，其中一个在分配其处理程序inline时使用onclick，另一个在使用事件侦听器分配时使用click（这是推荐的方式）。

你不能反过来使用它们，因为这是必须的，否则它们就不起作用。

阅读更多MDN:

https://developer.mozilla.org/en-US/docs/Web/Events/click
https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Event_handlers

$("#profile-register #submit").click(function (e) {
        e.preventDefault();
        console.log("I executed")
    })

成功阻止了默认的行为，但下面的代码不能

$("#profile-register #submit").onclick=function (e) {
        e.preventDefault();
        console.log("I executed")
    }

它使用参数重定向表单，您可以在上方的URL框中看到它

相关内容

最新更新

热门标签：