1. 被拖動元素的屬性設定為可拖放

   draggable = ‘true’

2. 規定元素被開始拖動時，會發生什麼

   Ondragstart = drad(event);//執行這個函式

Function Drag（ev）{

//設定被拖動元素的資料型別和值（值是被拖動元素的id）

//把被拖目標元素的id存到text裡面。

Ev.dataTransfer.setData(“Text”,ev.target.id);

}

1. 設定元素為可接收 被拖動的資料

   Ondragover = allowDrag（event）

   Function allowDrag(ev){

   //阻止預設（不允許把資料拖放到其他元素中）對資料的處理方式

   Ev.preventDefault();

   }

2. 當放置（鬆開滑鼠）被拖動資料時，會發生的drop事件

   ondrop = drop(event);

   function drop(ev){

//呼叫 preventDefault() 來避免瀏覽器對資料的預設處理（drop 事件的預設行為是以連結形式開啟）

Ev.preventDefault();

獲得被拖的資料。該方法將返回在 setData() 方法中設定為相同型別的任何資料

Var data = ev.dataTansfer.get(“Text”);

Ev.target.appenChild(document.getelementbyid(data));

/*ev.target.removeChild(document.getElementById(data))*/

}

阻止預設：阻止系統本應該發生的事件

5.實現來回拖動就是把放置目標（被拖動元素）的元素屬性設定為可接收元素

在放置目標的元素內加上ondrop屬性和ondragover屬性即可

ondrop="drop(event)" ondragover="allowDrop(event)"