Element.scrollWidth

Element.scrollWidth是测量元素内容宽度只读的属性，包括因为溢出在屏幕上不可见的内容。
scrollWidth的值等于不用横向滚动条把元素所有内容都包含在视窗里的最小值 ，scrollWidth的测量方式与clientWidth一致：它包括元素的内边距，但不包括边框，外边距和垂直滚动条(如果出现的话)。scrollWidth还可以包含伪元素的宽度如::before或::after。如果元素的内容没有超出元素的宽度，则scrollWidth的值与clientWidth的值是一样的。

示例

<style type="text/css">
    #box {
      
        height: 200px;
        width: 200px;
        padding: 50px;
        border: 10px solid red;
        /*overflow: scroll;*/
    }

    .inner-box {
      
        width: 1000px;
        border: 1px solid green
    }
style>
<div id="box">
    <div class="inner-box">div>
div>
body>
<script type="text/javascript">
    var box = document.getElementById('box')
    console.log(box.scrollWidth)
script>

scrollWidth = 1000 + 2 + 50 = 1052

参考文章

• Element.scrollWidth