用于最大宽度检测/功能的最佳语法javascript

今天我有一个关于Js最佳语法的问题：

这是通常的版本

function resize() {
    if ($(window).width() < 960) {
        $('. slect span').click(function () {
            $('.home-footer').toggleClass('open-in-mob');
        });
    } else {
        $('.home-footer').removeClass('open-in-mob');
        $('. slect span').click(function () {
            $('.home-footer').toggleClass('open-in-mob');
        });
    }
}
$(document).ready(function () {
    $(window).resize(resize);
    resize();
});

如果您认为其他语法更好，请分享：）

---

谢谢

通过使用CSS媒体查询，这可能会更容易/简化。在混合中添加JS以控制页面布局应该是最后的选择。你有一个更多的时间，你的页面速度越慢

CSS示例：

@media (max-width: 960px) {
    // Your code here
}

---

什么

匹配媒体

@乔纳斯：我在这里发现了一件事：完全取决于你。如果您只需要支持浏览器，并且更喜欢使用它，那么就使用它。如果你没有，就不要。但请注意，这两个代码段都存在一个问题，即当窗口宽度更改时，它们会注册并重新注册单击处理程序，这是一个典型错误。另外请注意，第一块中的选择器无效。@T.J.Crowder谢谢是的，选择器只是为了说明我的问题。好的，还有其他方法可以做同样的事情，但是稍微好一点吗？Hello@DonCarlos，不太好，因为我在clic上添加了一个函数。在.css中，规则将直接应用。或者，我应该只在响应视图中添加我的类规则。。嗯，测试。。

@media (max-width: 960px) {
    // Your code here
}