使用 javascript 或 angular js 隐藏侧边栏答案

【问题标题】：side bar hide using javascript or angular js使用 javascript 或 angular js 隐藏侧边栏
【发布时间】：2020-10-27 12:34:12
【问题描述】：

我正在为我的项目使用下面的 jquery 脚本。但我需要使用 javascript 或 angular js 来做到这一点。不是来自jQuery。我是怎么做的。我的功能

    $('.menu-item').click(function () {
        if ($(window).width() < 767) {
            $("body").removeClass("sidebar-open");
        }
    });

【问题讨论】：

标签： javascript jquery angularjs

【解决方案1】：

你可以只使用纯原生 JS 来替换 jquery。根据您之前的代码，它可能是：

var button = document.querySelector('.menu-item');
button.addEventListener("click", function(){
if (window.width < 767) {
  document.body.classList.remove("sidebar-open");
}});

【讨论】：

我可以在没有调用函数的情况下使用它吗？
我不这么认为。但是，为什么不使用 css 来解决这个问题呢？
如何使用 css 进行点击事件？你知道其他选择吗
我的意思是你可以使用 css 来隐藏你的侧边栏，例如当窗口的大小使用 css 媒体查询调整到 767 以下时。无论如何，您真的需要触发按钮单击来执行此操作吗？

【解决方案2】：

这就是你在 javascript 中的做法，基本上我将你的 jQuery 代码转换为 vanilla javascript：

const btn = document.querySelector(".menu-item")

btn.addEventListener("click", function() {
  if (window.screen.width < 767) {
    document.body.classList.remove("sidebar-open")
  }
})

【讨论】：

我可以在没有调用功能的情况下使用它吗？