javascript - 可以用 replaceChild 交换 元素吗？

Question

我有一个 <li> 的列表元素:

<ul id="mylist">
  <li id="item1">Item 1</li>
  <li id="item2">Item 2</li>
  <li id="item3">Item 3</li>
</ul>

我可以交换两个吗 <li>元素 - 比如说 item1 和 item2 - 带有 replaceChild ，DOM树修改方法之一？它适用于所有浏览器吗？

Answer 1

没有。 replaceChild 将从 DOM 中删除一个。你想要 insertBefore

var a = document.getElementById('item1');
var b = document.getElementById('item2');
a.parentNode.insertBefore(b, a);

当然，如果它们一开始就彼此相邻，这只会交换它们。

如果你想交换不相邻的元素，你可以利用 replaceChild。

var a = document.getElementById('item1');
var b = document.getElementById('item3');
var after_b = b.nextSibling;
var p = a.parentNode;

p.replaceChild(b,a);

if (after_b) {
    p.replaceChild(a, after_b);
} else {
   p.appendChild(a);
}