同樣是前幾天阿里電話面的一道簡單的DOM操作題，
但是由于自己DOM操作掌握的不熟練，答的很爛.....這里總結一下
首先這里用到了一個API,Node.insertBefore(a,b)在b節(jié)點之前插入a
在這之前首先要獲取這兩個元素的父親節(jié)點

<div>
      <div id="list1">list1</div>
      <div id="list2">list2</div>
      <div id="list5">list5</div>
      <div id="list6">list6</div>
</div>

<style>
      #list1{
        background:red;
      }
      #list2{
        background:orange;
      }
      #list5{
        background:green;
      }
     #list6{
        background:pink;
      }
</style>

假設要交換第一個和第五個元素
首先邏輯是先新建一個節(jié)點（標記節(jié)點），然后把這個節(jié)點插在第二個目標節(jié)點前面，相當于記下一個位置，然后把第二個目標節(jié)點插到第一個目標節(jié)點前面，再把第一個目標節(jié)點插在標記節(jié)點的后面，結束。

JS代碼：

function exchange(id_1,id_2){
  var newNode = document.createElement('div')
  list1.parentNode.insertBefore(newNode,id_2)
  list1.parentNode.insertBefore(id_2,id_1)
  list1.parentNode.insertBefore(id_1,newNode)
  list1.parentNode.removeChild(newNode)
}
exchange(list2,list6)

list2.png