Question

我不是在谈论浮动，也不是z-index（用于将一个放在另一个之上）。我正在谈论改变通过Javascript显示DIV的顺序。

例如，我有：

<div id='bottom'></div>
<div id='header'></div>

我想更改顺序，以便'标题'显示在'底部'上方，但不会“覆盖”它，也不会“浮动”。只是：

<div id='header'></div>
<div id='bottom'></div>

这是一个简单的问题，以前没有问过，我想。

Answer 1

您可以使用此Remove element by id删除第一个（首先将其保存到某个变量），然后使用JS中的appendChild（）或jQuery中的append（）附加它（如果您使用的是框架）。这应该有效地交换两者的位置。

编辑：看看this它基本上是您要求的相同问题，答案包含代码和您可能需要的其他所有内容。好像你搜索不够好。

Answer 2

也许是之前的答案：Reordering of Divs，它显示了一种纯Javascript方式和jQuery方式来重新排列div。谷歌搜索“重新排列div”也证明是富有成效的。

Answer 3

这取决于您使用的javascript库，但如果您使用jquery，则可以轻松完成。只需键入以下内容：

var header = $('#header');
$('#bottom').next().remove;
$('#bottom').before(header);

Answer 4

您只能使用Flexbox CSS执行此操作，具体取决于您要support的浏览器。否则你可以去找其他人提到的javascript解决方案。