在没有 jquery 的 javascript 中重新排序 div

Question

假设我有 html：

<div id="1">1</div>
<div id="2">2</div>
<div id="3">3</div>

我将如何在 javascript 而不是 jquery 中将这些 div 重新排序为：

<div id="1">1</div>
<div id="3">3</div>
<div id="2">2</div>

Answer 1

您可以使用display:flex和ordercss（我必须在您的 id 数字前添加一个字母，因为 SO 似乎不喜欢它的 css）

.container {display:flex; flex-direction:column}
#s1 {order:1;}
#s2 {order:3;}
#s3 {order:2;}

<div class="container">
  <div id="s1">1</div>
  <div id="s2">2</div>
  <div id="s3">3</div>
</div>

有关订单的更多信息

有关 flex 的更多信息

更新

抱歉读错了问题 - 以为你想在没有 js 的情况下做到这一点

var div = document.getElementById('3')

div.parentNode.insertBefore(div, document.getElementById('2'))

      <div id="1">1</div>
      <div id="2">2</div>
      <div id="3">3</div>