问获得translate3d后的divs位置

EN

const box = document.getElementById('box');
const printer = document.getElementById('printer');
const printBoxRectLeft = () => {
  printer.textContent = box.getBoundingClientRect().left;
  requestAnimationFrame(printBoxRectLeft);
};

printBoxRectLeft();

#box{
  width:30px; height:30px; background:red;
  animation: animX 3s infinite alternate;
}
@keyframes animX { to{ transform:translateX(300px); }}

<div id="printer"></div>
<div id="box"></div>

    var position = $('#element').position();
    var left = position.left;

'translate3d(256px, 512px, 0px)'.replace(/translate3d|px|\(|\)/gi, '').split(',');

// { x: trueLeft, y: translate3d[1], z: translate3d[2] }