寫一個蒙層，還未拖動前原始層在上面，

拖動那過程中（dragover）原始層在下面，

拖進目標元素后（drop），此時蒙層在上面，根據drop的$event獲取落在蒙層哪個div上，然后放進原始層相應的那個div，最后把原始層放上面

    //拖動過程中不斷觸發
    document.addEventListener("dragover", function (event) {

      document.getElementById('drop1').style.zIndex = '99';
      event.preventDefault();//取消瀏覽器的默認行為。
    });



   //落在哪一個單元格里

    document.addEventListener("drop", function (event) {
      event.preventDefault();
      for (var j = 0; j < 10; j++) {
        event.preventDefault();
          if (event.target.getAttribute("id") == "droptop-" + j) {//落到假的九宮格上（蒙層）
            console.log('單元格相等了')
            //克隆
            var itm = document.getElementById(this.drog);
            var cln = itm.cloneNode(true);
            document.getElementById("droppable-" + j).appendChild(cln);//加到真的九宮格里
            console.log(' document.getElementById("droppable-" + j)', 
            document.getElementById("droppable-" + j))
            itm.remove(cln);
            document.getElementById('drop1').style.zIndex = '-1';//假的九宮格放到下面
          }
        }
}