Use

function reloadScrollBars() {
    document.documentElement.style.overflow = 'auto';  // Firefox, Chrome
    document.body.scroll = "yes"; // Internet Explorer only
}

function unloadScrollBars() {
    document.documentElement.style.overflow = 'hidden';  // firefox, chrome
    document.body.scroll = "no"; // Internet Explorer only
}

对于您想要加载、卸载或重新加载滚动条的任何点，调用这些函数。当我在Chrome中测试它时，它仍然可以在Chrome中滚动，但我不确定其他浏览器。

如果出于某种原因，您希望使用box模型：border box，则向内部div添加填充（如当前接受的答案）将不起作用。

在这两种情况下都有效的方法是将内部div的宽度增加到100%加上滚动条的宽度（假设溢出：隐藏在外部div上）。

例如，在CSS中：

.container2 {
    width: calc(100% + 19px);
}

在JavaScript中，跨浏览器：

var child = document.getElementById('container2');
var addWidth = child.offsetWidth - child.clientWidth + "px";
child.style.width = 'calc(100% + ' + addWidth + ')';

只需使用以下三行，您的问题就会得到解决：

#liaddshapes::-webkit-scrollbar {
    width: 0 !important;
}

其中liaddshapes是要滚动的div的名称。

我只是想分享一个组合片段，用于隐藏开发时使用的滚动条。这是一组在互联网上找到的对我有用的片段：

.container {
    overflow-x: scroll; /* For horiz. scroll, otherwise overflow-y: scroll; */

    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
}


.container::-webkit-scrollbar {
    display: none;  /* Safari and Chrome */
}

只需将其添加到CSS文件中：

"&::-webkit-scrollbar": {
  display: "none",
  width: 0
},
"-ms-oveflow-style": "none" /* Internet Explorer and Edge */,
"scrollbar-width": "none" /* Firefox */,

这对我有用

div {
  -ms-overflow-style: none; /* Edge, Internet Explorer */
  scrollbar-width: none; /* Firefox */
  overflow-y: scroll;
}

// hides scrollbars while allowing to scroll
div::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}