Javascript 或 JQuery 需要重新加载页面，为什么？

Question

为什么 Javascript 或 jQuery 在应用某些效果之前需要重新加载页面？

CSS 是实时更新的

例子:

这是实时的

@media all and (max-width:767px) {
.nav-menu {
 margin:0px!important;
 }
 }

这需要重新加载页面才能看到效果，不要实时更新调整大小的窗口

if ($(window).width() > 980) {
do something
};

为什么？

Answer 1

因为后者是 JavaScript。目前，它是一个例程，仅在解析脚本标记时触发一次。您可以将它包装在一个函数中并多次触发它。例如在窗口调整大小事件上。前者是CSS，浏览器根据CSS规则不断更新页面。

window.addEventListener("resize", function(){
     if ($(window).width() > 980) {
         do something
     };
}, false);

或者在 jQuery 中:

$(window).on("resize", function(){
     if ($(window).width() > 980) {
         do something
     };
});

现在每次调整窗口大小时都会触发。