$(window).on('resize') 在 JavaScript

Question

在JavaScript中，是下面的代码：

window.onresize = function() {
    // Do something.
}

等同于：

$(window).on('resize', function () {
    // Do something.
});

以上两个代码块在功能方面是否相等？使用其中一个有什么优势或劣势（无论多么小）吗？

怎么样：

window.addEventListener('resize', function(event) {
    // Do something.
});

Answer 1

它们不一样，在第一个示例中，您正在影响 dom 对象 onresize 处理程序的事件。

jQuery 版本可能在幕后做了一些不同的事情。如果不查看源代码，它可能只是在做：

window.addEventListener('resize', function () {...})

也就是说，jQuery 版本和本机 addEventListener 仍然不同，因为 jQuery 也为事件处理程序添加了一些魔法。

而 addEventListenener 可能是向 DOM 对象添加事件的首选方式，因为您可以添加多个事件，但使用 dom 属性 on[event]仅限一场活动。

在阅读的同时，您还可以阅读有关 addEventListener 朋友的信息：removeEventListener。

Answer 2

不，它们不一样。你可以试试：

  $(window).on('resize',function1);
  $(window).on('resize',function2);

当 window 调整大小时，function1 和 function2 都会响应。

但是如果你使用

 window.onresize = function1;
 window.onresize = function2;

只有函数 2 响应。

$(window).on('resize') in JavaScript