function getBarWidth(){
    let outDiv = document.createElement("div");
    outDiv.style.width = "100px";
    outDiv.style.position = "absolute";
    outDiv.style.top = "-9999px";
    document.body.appendChild(outDiv);
    let widthnobar = outDiv.offsetWidth;

    outDiv.style.overflow = "scroll";

    let innerDiv = document.createElement("div");
    innerDiv.style.width = "100%";
    outDiv.appendChild(innerDiv);
    let widthbar = innerDiv.offsetWidth;
    
    document.body.removeChild(outDiv);

    return widthnobar - widthbar;
}

这是在element中实现自定义滚动条中，用于获取浏览器导航条宽度的原理。

理解：

        首先创建一个div，将他放在页面一个看不见的地方，通过绝对定位可以让它脱离文档流，不会弄乱自己的页面（虽然后面会移除）。获取 offsetWidth 包括内容、内边距、边框和滚动条。在这里获取到的就是内容宽度，我们设置的100;

        给外边框设置 overflow = scroll 后 会存在滚动条。获取子级的宽度。

        通过两次获取的宽度相减后得到的就是浏览器默认的滚动条宽度。

      这个可以使用在自定义滚动条中，毕竟默认的滚动条不好看。