js 获取dom 元素的width

现有多了class为resizable的元素
// jq写法
$('.resizable').parent().width();
// 如何通过js的写法实现jq这种写法的结果呢????
document.getElementsByClassName('resizable') ...
document.getElementsByClassName('resizable')[0].parentNode.clientWidth

<style>
        .box1 {
            width: 200px;
            height: 200px;
            color: red;
        }
        .box2 {
            width: 100px;
            height: 100px;
            color: #3d3d3d;
        }
    </style>


<body>
    <div class='box1'>
        <div class='box2'></div>
    </div>
</body>
<script>
    const pWidth = document.getElementsByClassName("box2")[0].parentNode.offsetWidth;
    console.log(pWidth);
</script>

document.getElementsByClassName("resizable")[0].style.width