如何在Javascript中使按钮居中

<div style="display: flex; justify-content: center; align-items: center;">
  <button>按钮</button>
</div>

<div style="position: relative;">
  <button style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">按钮</button>
</div>

<div id="container">
  <button id="button">按钮</button>
</div>

<script>
  var container = document.getElementById('container');
  var button = document.getElementById('button');
  
  // 计算居中位置
  var left = (container.offsetWidth - button.offsetWidth) / 2;
  var top = (container.offsetHeight - button.offsetHeight) / 2;
  
  // 设置按钮样式
  button.style.position = 'absolute';
  button.style.left = left + 'px';
  button.style.top = top + 'px';
</script>