Javascript 当modal打开时摆脱正文页滚动

我试图添加类

overflow:hidden

到

主体

标记，使用javascript隐藏滚动，但不会发生。我做错了什么

我通过标记名获取元素：

var body=document.getElementsByTagName（“body”）

然后，在触发模式后，我想将类
。无滚动{overflow:hidden；}
添加到body标记

var modal = document.getElementsByClassName("finance-modal")[0];
var btn = document.getElementsByClassName("finance-modal-btn")[0];
var span = document.getElementsByClassName("finance-modal-close")[0];
var body = document.getElementsByTagName("body");

btn.onclick = function() {
  modal.style.display = "block";
  body.classList.add("no-scrolling");
}
span.onclick = function() {
  modal.style.display = "none";
}
window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}

而且，它不起作用

这是我的
这可能不起作用
var body=document.getElementsByTagName（“body”）。尝试
var body=document.body取而代之

至于删除滚动，您需要设置
{overflow-y:hidden；}
完成

var body=document.querySelector（“body”）成功了

届时：

var modal = document.getElementsByClassName("finance-modal")[0];
var btn = document.getElementsByClassName("finance-modal-btn")[0];
var span = document.getElementsByClassName("finance-modal-close")[0];
var body = document.querySelector("body");

btn.onclick = function() {
    modal.style.display = "block";
    body.classList.add("no-scrolling");
}
span.onclick = function() {
    modal.style.display = "none";
    body.classList.remove("no-scrolling");
}
window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
        body.classList.remove("no-scrolling");
    }
}

返回一个
HTMLCollection
，而不是一个元素可能这就是您要查找的内容它不能解决您的问题，但我相信您需要文档。getElementsByTagName（“正文”）[0]